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FF 动画 已 经 迅速 进入 现代 传媒 的 各 个 领域 ,“ 闪 客 ” 们 通 
过 各 种 媒体 展示 自己 的 制作 技巧 与 个 性 ,这 些 有 个 性 有 追求 的 年 
轻 人 构成 了 广泛 存在 的 “ 闪 客 帝国 "。 
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经 典 的 优秀 Flash 作品 ， 以 Step by Step 的 方式 剖析 详细 制作 
步骤 , 并 深入 介绍 Flash MX 中 、 高 级 操作 技法 , 一 册 在 手 , Flash 
网 络 动画 、MTV、 互 动 游戏 、 音 乐 况 卡 制作 即 可 完全 攻略 。 
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威 的 Flash MX 高 级 实例 类 教程 , 适合 网 站 动画 设计 与 制作 人 员 
以 及 Flash 动画 爱好 者 ， 也 可 作为 相关 高 级 培训 班 的 教材 。 
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时 至 今日 ，Flash 动画 已 经 遍及 网 络 中 的 每 一 个 角落 ， 相 信 没 有 人 再 对 Flash 
存在 的 价值 和 它 强大 的 表现 力 有 所 质疑 了 , 它 的 出 现 , 甚至 改写 了 很 多 年 轻 人 的 
生活 方式 ， 一 度 成 为 时 尚 的 代名词 。 

看 过 流 误 免 、 大 话 三 国 系列 动画 吗 ? 听 过 “东北 人 都 是 活 雷锋 ”" 吗 ? 感受 过 
Eye4u 网 站 精彩 的 交互 视 效 吗 ? 我 们 在 欣赏 了 这 些 国内 外 精湛 的 Flash 作品 后 ， 
除了 由 衷 的 赞叹 之 外 , 更 纷纷 起 了 见 贤 思 齐 的 心情 , 几乎 每 人 都 渴望 能 够 亲手 创 
作 一 个 精彩 的 Flash 动画 。 虽 然 目前 市 面 上 相关 的 书籍 层出不穷 , 但 我 身边 许多 
搞 设计 的 朋友 以 及 论坛 里 的 网 友 却 还 是 经 常 向 我 诉苦 ， 说 看 过 很 多 的 Flash 教 
程 ， 可 还 是 不 知道 如 何 去 制 作 一 个 精美 的 贺卡 、MTV 或 是 网 络 动画 。 的 确 ， 市 
场 上 Flash 的 精品 书 不 少 但 却 鲜 有 能 够 完整 介绍 出 整个 动画 创作 流程 的 书 , 为 了 
弥补 这 一 空缺 ,我 与 出 版 社 的 策划 者 进行 了 多 次 的 分 析 、 讨 论 ， 并 根据 Flash 的 
功能 、 应 用 等 特点 选 出 了 这 33 多 个 精彩 的 例子 。 为 了 使 读者 能 真正 掌握 本 书 的 
精 网 , 我 在 写作 过 程 中 经 常 进行 换 位 思考 , 把 自己 当 作 一 个 初学 者 ， 从 头 到 尾 认 
真 检查 每 一 个 步 又， 生怕 落下 任何 一 个 知识 点 ， 其 中 的 艰辛 也 只 有 自己 能 够 理 
解 。 但 原本 书 能 起 到 抛砖引玉 的 作用 ， 为 你 在 通 往 闪 客 的 道路 上 贡献 一 份 力量 。 

本 书 分 为 4 大 部 分 共 33 章 ， 主 要 包括 网 络 动画 篇 、 网 络 广告 篇 、 有 声 有 色 
的 Flash 篇 以 及 网 络 互动 媒体 篇 ， 其 中 每 一 个 例子 都 具有 一 定 的 代表 性 和 典型 

性 。 本 书 适用 于 从 事 Flash 动画 制作 、 网 络 广告 设计 、 多 媒体 制作 

以 及 在 校 的 广大 设计 专业 的 学 生 ， 而 对 于 广大 的 Flash 

爱好 者 也 是 一 本 很 好 的 教程。 

授 之 以 鱼 不 如 授 之 以 渔 ， 所 以 在 本 书 

中 也 十 分 侧重 基础 概念 的 讲解 ， 由 浅 入 深 地 

将 各 种 技巧 抽 丝 剥 茧 ， 力 求 阐明 最 基本 的 

概念 与 应 用 范围 , 还 不 断 举一反三 , 让 读 
者 将 来 能 对 Flash 应 用 自如 。 

最 后 ， 真 心 感谢 我 的 父母 ， 是 他 们 

的 鼓励 ， 才 让 我 坚持 做 完 这 本 书 。 同 时 ， 

特别 感谢 资深 策划 裴 红 义 先生 ， 他 在 本 

书 创作 过 程 中 给 予 我 悉心 指导 。 并 感谢 

刘 冰 、 刘 晨 、 李 帆 、 古 悦 、 胡 研 、 张 鞍 、 

王 字 晨 等 朋友 ， 他 们 在 本 书 的 创作 过 程 中 

给 予 我 许多 版 式 方面 的 建议 ， 在 这 些 朋 友 的 
无 私 帮助 下 ， 本 书 才 得 以 顺利 完成 。 

最 后 再 送 给 所 有 热爱 生活 的 人 一 句 话 : Flash 

正如 一 只 画笔 , 请 用 它 来 记忆 你 生活 中 的 丝 丝 记忆 吧 ! 


作者 
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30i62 缚 二 256 
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第 31 章 MTV 的 制作 RN 


31.1 导入 截 选 的 声音 文件 和 四 
31.2 绘制 曹 图、 制作 分 镜头 与 上 机 着 色 
31.3 MTYV 制作 过 程 大 揭 密 pp 
31.3.1 制作 山脉 、 星 空 的 动态 效果 
31.3.2 制作 月 亮 、 湖 光 的 效果 PR 
31.3.3 对口 型 
31.3.4 制作 人 物 行 走 的 动态 效果 pp 
31.3.5 ”制作 钉子 的 送 动 轨 这 
31.3.6 ”挥手 的 动态 效果 PN 
31.3.7 制作 黑色 外 杠 由 本 
31.4 小 缚 9 


第 32 章 网 络 宣传 动画 pp -ee。 


32.1 制作 动画 所 需要 的 基本 元 素 pp 
32.2 合成 动画 影片 0 4 
32.3 制作 文字 动态 效果 RN 
32.4 制作 局 部 特写 效果 pp 
32.5 ”制作 跌倒 的 动画 效果 pp 
32.6 “影片 结尾 的 动画 效果 PR 
32.7 ”制作 影片 的 预 载 画面 pp 
32.8 涉 缚 4 


33 .1 制作 网 页 Logo 动画 
33.2 制作 页 面 动画 效果 ss 
33.3 按钮 的 动画 效果 ev 
33.4 合成 按钮 2 
33.5 合成 影片 与 设置 fScommandgd pp 
33.6 小 结 和 
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理解 Flash MX 的 核心 概念 
掌握 影片 的 建立 、 编 辑 和 发 布 的 基本 流程 

如 何 使 用 Flash 中 的 基本 绘图 工具 进行 图 形 编辑 和 制作 
了 解 Flash MX 中 的 基本 动画 类 型 

学 习 Properties (属性 ) 面板 的 应 用 


掌握 Timeline (时 间 轴 ) 与 Symbol (元 件 ) 等 相关 的 基本 操作 


1.1 关于 Flash 


1.1.1， Flash 是 一 种 什么 软件 


Flash 是 目前 最 优秀 的 网 络 动画 编辑 软件 之 一 , 它 的 出 现 , 宣告 了 网 络 动画 时 代 的 到 来 。 

由 于 Flash 本 身 具 有 强大 和 灵活 的 网 络 交互 功能 , 所 以 它 在 窒 带 领域 已 经 成 为 事实 上 的 交互 
多 媒体 技术 标准 。Flash 在 保证 传输 速度 快 的 同时 ， 还 提供 了 非常 丰富 的 交互 动画 效果 ， 它 
是 如 此 简单 和 有 效 ， 以 至 任何 人 在 短 时 间 内 都 可 以 成 为 内容 高 手 。 可 以 说 ，Flash 在 推动 网 
络 动画 的 普及 与 大 众 化 方面 功 不 可 没 。 


1.1.2 ”Flash MX 系统 需求 


Windows， 

CPU:， 至 少 200MHz Intel Pentium 处 理 器 

操作 系统 : Windows 98 第 二 版 、Windows Me、Windows NT4，、Windows 2000 或 Windows XP 
内 存 ; 至 少 64 MB 可 用 系统 内 存 (推荐 128MB] 

硬盘 至少 85 MB 可 用 磁盘 空间 

显示 器 :分辨 率 1024 x 768Pixels、16 位 色 以 上 显示 器 效果 更 佳 

光驱 : CD-ROM 驱动 器 

Macintosh: 

CPU: Power Macintosh with Mac OS 9.1 或 更 高 版 本 0OS X 10.1 或 更 高 版 本 

内 存 : 至 少 64 MB 可 用 系统 内 存 (推荐 128MB ) 


硬盘 : 85 MB 可 用 磁盘 空间 
显示 器 ， 分 辩 率 1024 x 768Pixels、16 位 色 以 上 显示 器 效果 更 佳 
光驱 : CD-ROM 驱动 器 


1.1.3 “Flash MX 的 应 用 范围 


(1) Flash 制作 短篇 动画 、MTYV 。 

(2) Flash 广告 . 产品 展示 。 

(3) Flash 网 站 、 站 点 片头 。 

(4) Flash 制作 多 媒体 课件 、 多 媒体 光盘 。 
(5) Flash 游戏 。 

(6) 高 效 的 转播 载体 。 


1.1.4 Flash MX 中 的 新 增 功 能 


(1) 视频 支持 : Flash MX 新 增 了 导入 视频 和 按 流 媒体 格式 播放 视频 的 支持 ， 这 一 功能 
适用 于 在 Flash 站 点 和 应 用 程序 中 添加 视频 短片 .Flash 可 以 导入 QuickTime 或 Windows 媒 
体 播放 器 ”所 支持 的 任何 标准 视频 文件 . 包括 MPEG、DY (数字 视频 ) 、MOY (QuickTime 电 
影 格 式 ) 和 AVI 等 。Flash 中 的 视频 对 象 可 以 操纵 缩放、 旋转 、 偏 移 、 使 用 蒙 板 效果 或 通 
过 移动 渐变 实现 动画 等 . 添加 脚本 还 可 以 使 它们 产生 交互 .Macromedia Flash Player 6 通过 
Sorenson Spark 编码 解码 器 实现 了 对 视频 的 支持 。 

(2) 熟悉 的 用 户 界面 , 新 增 属 性 检查 器 和 Answers (答案 ) 面板 : 通过 Macromedia Flash 
MX 熟悉 而 灵活 的 开发 环境 , 用 户 可 以 快速 掌握 其 用 法 . 用 户 界面 增强 功能 包括 可 折 县 的 面 
板 和 新 的 属性 检查 器 , 属性 检查 器 可 以 为 当前 选 定 的 工具 和 对 象 显示 关联 选项 .新 的 用 户 界 
面 中 还 包括 一 个 Answers (答案 ) 面板 ， 可 以 直接 连接 到 开发 工具 ， 为 设计 人 员 和 开发 人 
员 提供 实用 信息 。 

(3) 动态 载 入 JPEG 图 像 和 MP3 声音 : Macromedia Flash Player 6 现在 可 以 在 运行 时 动 
态 载 入 JPEG 图 像 和 MP3 声音 。 这 样 做 的 结果 是 可 以 优化 文件 量 . 开发 人 员 也 更 容易 对 内 容 
进行 修改 ， 但 是 并 不 需要 重新 编辑 它 。 

(4) 命名 书签 : 本 功能 可 以 开发 实用 的 用 户 界 面 和 应 用 程序 , 确保 观众 获得 最 佳 Web 体 
验 。 在 添加 命名 书 等 之 后 ，Macromedia Flash MX 的 内 容 可 以 被 标记 ， 这 意味 着 用 户 可 以 使 
用 浏览 器 中 的 “前 进 ”/ “后 退 ” 按 钮 在 Flash MX 内 容 中 浏览 。 

(5) 新 增 图 形 设 计 工 具 和 混 色 器 增强 功能 ， 新 的 自由 变形 工具 和 对 齐 像素 功能 允许 设 
计 人 员 更 快 . 更 好 . 更 自由 地 创建 和 控制 图 形 。 混 色 器 增强 功能 使 得 颜色 的 创建 编辑 和 应 
用 比 以 前 更 加 轻松 。 

(6) 经 过 优化 的 应 用 程序 服务 器 集成 : Macromedia Flash MX 人 允许 开发 人 员 使 用 XML 
结构 的 数据 处 理 丰 富 数据 ,使 用 Flash 制作 应 用 程序 和 直观 的 用 户 界面 ， 创 建 销售 表单 、 可 
视 化 的 购物 车 、 顾 客 调 查 表 和 证 券 交 易 行情 图 。 持 续 的 XML 连接 将 允许 关键 信息 立即 更 新 
并 即时 显示 。 

(7) 开发 和 播放 有 关 辅 助 功能 的 内 容 ， Macromedia Flash Player 6 通过 对 Microsoft 
Active Accessibility (激活 辅助 功能 ) 的 支持 实现 了 对 辅助 技术 (例如 屏幕 放大 等 ) 的 支持 。 


此 外 , Macromedia Flash MX 还 集成 了 创建 辅助 内 容 的 工具 。 要 为 动画 和 用 户 界 面 添加 说 明 
文本 ， 可 先 选 中 所 需要 项 目 ， 然 后 输入 恰当 的 说 明 。 

(8) 多 语种 支持 : Flash 播放 器 新 增 了 对 坚 排 文本 和 Unicode 的 支持 , Macromedia Flash 
MX 现在 支持 11 种 国际 语言 ， 允 许 开 发 人 员 快 速 建立 多 语种 的 内 容 和 应 用 程序 。 新 增 的 语 
言 支持 包括 : 朝鲜 语 、 繁 体 中 文 和 简体 中 文 。 

(9) 为 多 种 系统 平台 和 设备 设计 : 使 用 Flash 设计 的 内 容 可 以 在 任意 浏览 器 、 系 统 平 
全 和 支持 Macromedia Flash Player 的 设备 上 使 用 。 它 是 可 以 在 Internet 上 分 发 的 最 广泛 的 丰 
富 客户 机 技术 。Macromedia 正在 和 硬件 制造 商 、 操 作 系 统 开发 商 和 浏览 器 提供 商 协作 ， 确 
保 Macromedia Flash Player 可 以 跨越 主流 桌面 系统 和 设备 平台 (Microsoft Windows、Apple 
Macintosh、Linux 、Solaris、MicrosoftTV 、Symbian EPOC 和 Pocket PC 等 等 ) 。 

(10) 内 置 用 户 界面 组 件 : Flash MX 包含 一 组 最 常用 的 应 用 程序 界面 预 置 组 件 ， 包括: 
滚动 条 .丰富 文 本 域 、 输 入 按钮 、 单 选 钮 和 复 选 框 、 列表 和 组 合 框 等 。 这 些 组 件 构架 对 加 快 
开发 速度 大 有 神 益 ， 而 且 还 可 以 确保 界面 组 件 在 多 个 Flash MX 应 用 程序 中 的 统一 。 


1.2 “Flash MX 基本 功能 简介 


1.2.1 Flash MX 操作 界面 


Flash MX 的 操作 界面 如 图 1-1 所 示 ， 大 致 分 为 菜单 栏 、 时 间 轴 、 工 具 栏 、 场 景 、 属 性 
面板 与 浮动 面板 共 六 个 部 分 。 


FE 有 1 习 


图 1-1 Flash MX 操作 界面 
1.2.2 “Flash 工具 面板 
Flash MX 为 我 们 提供 了 一 些 基 本 的 矢量 绘图 工具 ， 整 个 工具 面板 共 分 为 绘图 工具 (图 
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四 


国 曲 国 


经 典 作 品 解 析 |@ 


2)、 预 览 工具 (图 1-3)、 色 彩 区 域 (图 1-4) 和 选项 区 域 (图 1-5) 共 四 大 部 分 。 


殉 . 习 一 笔 刷 工具 
过 验 一 一 渐变 调整 工具 


称 一 一 填充 工具 View 
29= -橡皮 工具 手 形 工具 一 全 一 放大镜 工具 


图 1-2 绘图 工具 图 1-3 预览 工具 


自由 变换 工具 


交换 填充 色 
无 填充 色 
恢复 默认 设置 
图 1-4 色彩 区 域 图 1-5 选项 区 域 
(1) 轩 移 动工 具 。 


快捷 键 : VY ( 精 选 工具 为 A) 。 
主要 功能 ; 选择 对 象 、 移 动 对 象 以 及 调整 曲线 等 等 (图 1-6、 图 1-7)。 


图 1-6 移动 对 象 图 1-7 调整 曲线 


(2) 区 直线 工具 。 
快捷 键 : N。 
主要 功能 : 配合 Shift 键 可 以 绘制 出 特定 角度 的 直线 ， 如 图 1-8 所 示 。 
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图 1-8 绘制 直线 


(3) 史 套 索 工 具 。 


快捷 键 : 上 。 
主要 功能 : 可 以 使 用 不 规则 选取 方式 对 矢量 图 形 进 行 选 择 ， 如 图 1-9 所 示 。 


图 1-9 自由 选择 方式 


(4) 本 钢笔 工具 。 

快捷 键 : P。 

主要 功能 : 钢笔 工具 可 以 非常 精确 地 对 所 绘图 形 进行 控制 (图 1-10)。 

(5) 圆 形 工具 和 总 矩形 工具 。 

快捷 键 : O ( 圆 形 )、R (矩形 ) 。 

主要 功能 : 配合 Shift 键 ， 可 以 在 场景 中 绘制 出 圆 形 或 正方 形 ， 如 图 1-11 所 示 。 


本 后: 乓 遇 病 到 所 各 大 网 天 1 
图 1-10 曲线 图 1-11 圆 形 与 正方 形 


(6) 到 铅笔 工具 。 


快捷 键 : Y。 
主要 功能 : 铅笔 工具 的 自由 度 很 大 ， 它 可 以 在 图 1-12 所 示 的 三 种 模式 下 工作 。 


AN 
引 | 
o 


直线 模式 (Straighten) : 绘制 的 线条 棱角 明显 。 

光滑 模式 (Smooth) : 绘制 平滑 的 曲线 。 

自由 模式 (Ink) :自由 绘制 曲线 ， 对 线条 不 进行 修饰 。 
(7) 贺 笔 刷 工 具 。 

快捷 键 : B。 

主要 功能 : 笔 刷 工具 可 以 在 画面 上 绘制 出 具有 一 定 笔触 效果 的 图 形 , 它 可 以 在 图 1 一 13 
所 示 的 五 种 模式 下 工作 ， 比 较 适合 使 用 手写 板 进行 创作 的 人 员 。 


十 一 | 一 下 -一 十 一 十 


一 十 一- 十 一 | 一 二 


图 1-13 五 种 模式 


正常 模式 (Paint Normal) ， 用 正常 的 方式 进行 绘制 ， 线 条 和 填充 全 部 被 笔 刷 所 覆盖 。 
填充 模式 (Paint Fill) : 笔 刷 只 对 图 形 的 填充 进行 覆盖 ， 对 线条 轮廓 不 起 作用 。 
背后 模式 (Paint Behind): 笔 刷 只 对 矢量 图 形 的 背后 进行 填充 ， 这 种 模式 很 适合 绘制 背 


区 域 模式 (Paint Selection) : 笔 刷 只 对 当前 被 选择 的 矢量 图 形 起 作用 。 

内 部 模式 (Paint Inside) : 笔 刷 只 对 完全 封闭 的 填充 区 域 起 作用 。 

(8) 启 填充 工具 。 

快捷 键 : K。 

主要 功能 : 可 以 对 场景 中 闭合 的 区 域 使 用 单一 色彩 或 渐变 色彩 进行 填充 ,如 图 1-14 所 
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图 1-14 对 闭合 的 区 域 进行 填充 


(9) 汝 自由 变形 工具 。 

快捷 键 : Q。 

主要 功能 : 可 以 对 场景 中 所 有 的 元 素 进行 旋转 和 缩放 操作 (图 1-15), 如 果 选 择 的 对 象 
是 被 打 散 的 矢量 图 形 时 ， 还 可 以 进行 扭曲 和 造型 修正 操作 ， 如 图 1-16 所 示 


吧 站 


图 1-15 旋转 和 缩放 图 1-16 扭曲 和 造型 修正 


1.3 Flash MX 基础 动画 类 型 

Flash MX 中 的 动画 可 以 划分 为 三 种 基本 类 型 : Motion Tween (运动 过 渡 ) 动画 、Shape 
(形状 变形 ) 动画 和 逐 帧 动画 。 
1.3.1 _ Motion Tween (运动 过 渡 ) 动画 


Motion Tween 动画 是 将 两 个 关键 帧 的 属性 作为 变化 参数 (如 位 置 、 透 明度 和 色彩 等 ) 
并 实时 计算 出 过 渡 动 画 的 一 种 动画 类 型 。 如 图 1-17 所 示 的 Motion Tween 动 画 就 属于 位 置 的 
过 渡 变 化 。 


195 200 205 219 245 220 225 239 


图 1-17 Motion Tween 动画 


除了 一 些 基 本 的 属性 变化 外 , 还 可 以 在 Properties 面板 中 设置 一 些 特殊 的 参数 , 如 图 1- 
18 所 示 。 


厂 Dentopath 杰 se 区 snap 
1-18 Properties 面板 


1.3.2 Shape (形状 变形 ) 动画 


shape 动 画 是 根据 两 个 关键 帧 中 的 内 容 自动 计算 出 过 渡 帧 的 一 种 变形 动画 , 相当 于 两 个 
关键 帧 中 的 图 形 相互 切换 而 形成 的 动画 效果 ， 如 图 1-19 所 示 。 


1 
二 | 


1-19 Shape 动画 
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1.3.3 逐 帧 动画 
逐 帧 动画 与 传统 的 动画 片 在 制作 方式 上 颇 为 相似 , 每 一 帧 内 的 图 形 都 是 手工 绘制 的 , 如 
图 1-20 所 示 的 文字 动画 就 是 采用 逐 帧 动画 的 方式 制作 的 。 


站 外 昌 误 本 到 加 9 120fps 80s 1 


图 1-20 逐 帧 动画 


1.4 小 结 


本 章 主 要 介绍 了 Flash MX 中 的 一 些 基 本 概念 以 及 主要 绘图 工具 的 使 用 ,为 今后 的 学 习 
做 了 一 定 的 铺垫 。 实 际 上 Flash MX 中 所 涉及 的 内 容 是 十 分 广泛 的 ,不 将 这 些 理论 知识 应 用 
到 实际 的 制作 中 ， 还 是 无 法 真正 掌握 Flash 动画 的 制作 精华 的 。 俗 话说 “ 工 欲 善 其 事 、 必 先 
利 其 器 ”我 们 首先 要 了 解 Flash， 了 解 我 们 进行 创作 的 工具 , 只 有 这 样 , 精彩 的 Flash 动画 才 
能 在 我 们 的 手中 诞生 。 
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跳动 的 短 消息 


了 解 Flash MX 的 操作 界面 和 基本 功能 

如 何 绘制 矢量 图 像 背景 

如 何 制作 最 基本 的 运动 过 渡 动 画 

熟悉 Symbol (元 件 ) 的 三 种 属性 : 图 像 、 按 钮 和 影片 片段 


掌握 目标 对 象 的 大 小 、 颜 色 和 透明 度 等 渐变 动画 的 制作 方法 


| 预览 成 品 | 


制作 这 个 动画 的 目的 主要 是 让 大 家 先 熟悉 一 下 Flash MX 的 基本 操作 ， 了 解 动画 中 图 像 
和 文字 的 自由 移动 、 大 小 缩放 、 变 形 、 变 色 以 及 变 透 明 等 渐变 过 程 , 如 图 2-1 和 图 2-2 所 示 。 


图 2-1 成 品 效果 之 一 图 2-2 成 品 效果 之 二 


| 操作 步骤 | 


2.1 矢量 背景 图 的 制作 


Step 1 首先 启动 Flash MX 软件， 建立 一 个 新 的 文件 。 用 鼠标 单 击 默认 工作 区 下 面 的 
Properties (属性 ) 面板 ， 如 图 2 一 3 所 示 。 


图 2-3 Properties 面板 


单 击 Properties 面板 的 Size 按钮 ， 弹 出 如 图 2 一 4 所 示 的 Document Properties 面板 ， 将 太 


寸 改 为 300 x 200Pixels。 


Ocument Properties 


imensions : Eco xz (idtl  x Foo px height 
Watch: Erinter | Sentents | Defeat | 


Background 
了 rane Rate: 加 印 s 
Ruler Units: |Pixels >] 


Help | man Default| Cancel | 


图 2-4 Document Properties 面板 


Step 2 ”这 一 步 将 要 绘制 一 个 信封 模样 的 矢量 背景 图 形 ， 目 的 是 使 画面 产生 丰富 的 视 
觉 效果 和 层次 感 。 


双击 Timeline (时 间 轴 ) 中 的 Layer 1 图 层 ， 将 它 改名 为 “背景 (图 2 一 5)。 


2-5 改名 为 “背景 


Step 3 选择 工具 栏 中 的 元 画 线 工 具 ， 在 Properties 面板 中 将 线条 形式 设置 为 虚线 ， 线 
条 的 粗细 程度 值 设 置 为 3， 如 图 2-6 所 示 。 


ww Properties 


Line 
人 


要 


2-6 在 Properties 面板 中 设置 线条 


配合 Shift 键 在 场景 中 沿 四 边 绘制 出 四 条 虚线 ,注意 要 留 出 一 定 的 空隙 以 便 将 来 绘制 投 
影 ， 如 图 2 一 所 示 。 
继续 绘制 出 信封 的 折 页 ， 效 果 如 图 2 一 8 所 示 。 


图 2-7 绘制 出 四 条 虚线 图 2-8 绘制 信封 折 页 
Step 4 下 面 来 制作 信封 的 投影 。 继 续 使 用 / 男 线 工 具 ， 将 填充 色 的 R、G、B 值 设置 
为 : 208、208、208。 在 Properties 面板 中 将 线条 形式 设置 为 solid 形式， 粗细 程度 设置 为 5， 
如 图 2 一 9 所 示 。 


图 2-9 在 Properties 面板 中 设置 线条 粗细 


配合 Shift 键 绘制 出 信封 的 投影 。 到 此 为 止 , 一 个 最 基本 的 背景 图 就 制作 完成 了 (图 2 一 
fj 
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图 2-10 背景 图 


2.2 ”基础 的 文字 动画 效果 
Step1 在 Timeline 面 板 中 新 建 一 个 图 层 并 起 名 为 “Look ， 如 图 2--11 所 示 。 


图 2-11 新 建 “Look” 图 层 


lotoshop 中 的 图 层 比较 相似 ， 每 个 图 层 中 的 动画 互 不 于 扰 。 对 复杂 的 动画 他 细 
分 析 后 就 不 难 是 由 很 多 个 拥有 不 同 动画 效果 的 图 层 组 成 的 。 


单 击 “Look ”图 层 ， 使 用 A 文 字 工 具 在 场景 中 输入 ”Look! “字样 ， 并 在 Properties 面 
板 中 改变 文字 的 颜色 、 字 体 以 及 大 小 等 参数 (图 2 一 12) 


SeueTew 了 久 [rmesNewPoman ?|] 户 。 表 , 了 B| 了 JEEE 二 北 = 扑 了 


Tewt Tool 多 了 Normal ~ [了 autcKerm 


图 2-12 Properties 面板 


Step 2 ” 按 F8 键 将 它 转 化 为 一 个 Symbol 并 命名 为 “Look ` ， 其 他 参数 保持 默认 (图 
关 - 往 ) 


Conyvert to Symbol 吉 观 | 


um Ce 
Bahavior: 人 可 闪闪 Registrati 办 
矿 Batton 喷 | 


LE Adyvanced | elp | 


图 2-13 转化 为 Symbol 


Step 3 按 F5 键 将 两 个 图 层 的 时 间 轴 延长 至 第 90 帧 , 如 图 2--14 所 示 。 按 F6 键 在 “Look 
图 层 中 的 第 15 和 第 30 帧 上 分 别 插入 关键 帧 ， 然 后 用 鼠标 右键 单 击 当 前 图 层 的 第 1 帧 ,在 弹 
出 的 菜单 中 选择 Create Motion Tween 产生 移动 渐变 动画 (图 2-15)。 


图 2-14 延长 时 间 轴 图 2-15 生成 Motion Tyween 动画 


GO | 下 = 本 跳动 的 短 消息 


Step 4 选取 第 1 帧 内 的 文字 图 形 ， 将 它 的 Alpha( 透 明度 ) 设 置 为 0， 如 图 2 一 16 所 示 。 


nstance Name Swap_ 
W: 1583 %Jat 


H: 户 5 兴 [27s 


图 2-16 设置 Alpha (透明 度 ) 为 0 


选取 第 15 帧 内 的 文字 图 形 ， 将 它 向 上 移动 至 图 2-17 所 示 的 位 置 。 按 下 Enter 键 预览 
Timeline， 就 能 看 到 一 个 由 透明 变 为 实体 ， 又 向 上 移动 的 动画 效果 了 。 


图 2-17 预览 动画 


Step 5 ”新建 一 个 图 层 ， 在 第 30 帧 上 插入 关键 帧 ， 使 用 念 文字 工具 在 场景 中 输入 “ 短 
消息 ! “字样 。 在 Properties 面 板 中 调整 出 合适 的 颜色 和 大 小 并 按 F8 键 将 它 转化 为 一 个 Symbol。 
在 第 50 和 第 60 帧 上 同样 插入 关键 帧 ， 最 后 生成 Motion Tween 动画 ， 如 图 2-18 所 示 。 


图 2-18 生成 Motion Tween 动画 


园 国 的 国 
sh MX 经 典 作 品 解 析 |O 


第 1 


Step 6 在 Properties 面板 中 改变 第 30 和 第 60 帧 文字 的 透明 度 及 色彩 ， 就 会 形成 一 段 
由 透明 紫色 渐变 到 棕 黄 色 的 动画 效果 了 。 使 用 鼠 自 由 放 缩 工具 对 第 60 帧 的 文字 图 形 进行 一 
定 的 等 比 放 缩 并 将 Alpha 的 值 设置 为 0， 最 后 效果 如 图 2 一 19 所 示 。 


图 2-19 设置 Alpha 


按 下 回 车 键 进行 预览 , 觉得 效果 怎么 样 》 到 目前 为 止 ,我们 已 学 会 了 对 目标 图 像 进行 大 
小 . 颜色 .透明度 及 位 置 上 的 变形 动画 了 ,其 实在 高 手 的 作品 中 也 能 经 常 看 到 这 几 个 基本 动 
画 的 影子 。 
Step 7 新建 一 个 图 层 并 置 于 顶层 ， 然 后 选取 “ 短 消息 ”图 层 第 50 帧 中 的 文字 图 形 ， 
| 按 Ctrl+C 进行 复制 (图 2 一 20) 。 


图 2-20 选取 文字 图 形 


再 回 到 新 建 的 图 层 中 ， 在 第 30 帧 插入 一 个 关键 帧 ， 然 后 按 Ctrl+Shift+V 组 合 键 进 行 复 
制 并 生成 Motion Tween 动画 ， 关 键 帧 位 置 如 图 2 一 21 所 示 。 


0 5 20 25 3 3 4 4 肥 呈 反 上 mm 1 8 65 9% 


图 2-21 关键 帧 位 置 


90023540 本 it 动 的 类 消息 


Ctrl+V 与 Ctrl+Shift+V 的 区 别 : 
EPE V 只 是 粘贴 所 要 复制 的 前 层 ， 粘 贴 的 位 置 不 
Ctrl+Shift+V 则 村 粘贴 (Paste in Place 


有 很 大 帮助 的 ， 结 合 实 { 副 我 们 就 看 出 它 的 优点 了 。 


Step 8 单 击 第 30 帧 ， 在 Properties 面板 中 将 Ease 的 值 设置 为 -60 (图 2 一 22)。 使 用 
草 工 具 对 第 30 帧 中 的 文字 图 形 进 行 一 定 的 等 比 放 大 并 设置 Alpha 为 0 (图 2-23)， 最 后 形成 
图 2-24 所 示 的 动画 ， 也 可 以 试 着 改变 它 的 颜色 ， 形 成 更 加 丰富 的 视 沉 效果. 


Effect: None 
| EE Evenmt 闻 本 本 可 


No sound selected 


厂 orienttopath [sene [ snap 


图 2-22 Properties 面板 


Properties 
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图 2-23 设置 Alpha 为 0 


图 2-24 动画 效果 


Step 9 在 当前 图 层 的 第 55、 第 60 和 第 65 帧 上 分 别 插入 关键 帧 ， 适 当 改变 一 下 文字 


的 色彩 并 生成 Motion Tween 动画 。 单 击 第 60 帧 ， 选 择 Modify | Tranform | Filp Horizontal 
这 样 就 形成 了 一 个 翻转 效果 的 动画 (图 2 一 25) 。 


命令 ， 


四 外 井 国 
ESh MX 经 


典 作 


第 1 篇 


图 2-25 水 平 镜像 


Step 10 ”制作 闪烁 的 动画 效果 。 在 当前 层 的 第 72 和 第 76 帧 分 别 插入 关键 帧 ， 然 后 
用 鼠标 右键 分 别 单 击 第 70 和 第 74 帧 ， 在 弹出 的 菜单 中 选择 Insert Blank Keyframe 命令 ， 用 
空白 帧 来 模拟 闪烁 的 效果 (图 2-26)。 


图 2-26 插入 空白 帧 


所 有 的 制作 完成 后 ,选择 File | Export Movie 命令 ,输出 成 Swf 格 式 的 文件 ， 这 样 一 个 
简单 的 动画 效果 就 制作 完成 了 。 


2.3， 小 结 


通过 本 章 的 学 习 , 我 们 已 经 掌握 了 最 基本 的 制作 动画 的 方法 以 及 一 些 绘图 工具 的 使 用 。 
对 于 刚刚 踏 入 闪 客 族 的 初学 者 来 说 , 掌握 图 形 的 大 小 、 颜色. 透明 度 和 位 置 上 的 变形 动画 是 
非常 重要 的 ， 深 入 学 习 Flash 后 就 不 难看 出 ,很 多 复杂 的 技巧 都 是 在 这 些 简单 的 动画 基础 上 
变化 出 来 的 。 

如 果 你 也 认为 这 些 基 础 很 重要 , 那 就 充分 发 挥 自 己 的 想像 力 , 去 做 一 个 属于 自己 的 动画 
吧 ! 


小 丛 快 跑 


利用 笔 刷 工具 绘制 卡通 形象 与 场景 
学 习 并 掌握 Motion 动画 的 制作 原理 及 过 程 

移动 引导 线 动画 的 制作 过 程 

了 解 Library 图库 的 概念 

如 何在 元 件 中 制作 循环 动画 ， 并 用 简单 的 技术 做 出 令 人 印象 深刻 的 动画 效果 


了 解 影片 片段 在 Flash 动 画 中 的 实际 应 用 


本 章 的 主要 内 容 是 如 何 利用 移动 引导 线 来 制作 动画 ,并 了 解 影片 片段 在 Flash 动画 中 的 
实际 应 用 , 熟练 地 应 用 这 些 技术 往往 可 以 营造 出 很 多 丰富 的 视觉 画面 。 成 品 效果 如 图 3-1 和 
图 3 一 所 示 。 


图 3-1 成 品 效果 之 一 


3.1 绘制 主角 


首先 要 在 脑子 里 确定 主角 的 形象 , 如 果 没 有 把 握 , 可 以 先 绘制 草图 . 可 能 初学 者 在 绘制 
矢量 图 形 时 不 知 该 如 何 下 手 ， 其 实 这 和 我 们 用 铅笔 绘画 是 一 样 的 道理 , 先 要 从 外 轮廓 开始 。 

Step 1 打开 Flash MX， 新 建 一 个 文件 ， 将 Properties 面板 中 Background (背景 ) 色 设 
定 为 站 666699， 其 他 设置 保持 默认 (图 3-3)。 


区 了 = saw io0pane_ | Boond 国 | 


小 从 快 吨 -:- Publsh Lp 


图 3-3 设置 背景 色 


Step 2 按 Ctrl+F8 组 合 键 创建 一 个 新 的 Symbol (元 件 ) ， 在 弹出 的 对 话 框 中 按 图 3 一 4 
所 示 进 行 设 置 ， 单 击 OK 按钮 关闭 对 话 框 。 按 Ctrl+L 组 合 键 打开 Library (文件 库 ) 面板 ， 就 
会 看 见 我 们 刚刚 创建 的 Symbol 了 。 


ate New Symbol 国耻 | 
ws [CE 
区 rr 
| ET | 


列 Elie Advanced | Help | 


图 3-4 创建 Symbol 


Step 3 使 用 立 笔 刷 工 具 在 新 创建 的 Symbol 中 绘制 人 物 的 外 轮廓 ， 注 意 要 让 所 绘 的 
轮廓 形成 一 个 封闭 的 空间 , 以 便 填 充 颜色 (图 3-5)。 有 条 件 的 话 可 以 使 用 压 感 笔 来 绘制 , 按 
下 Use Pressure (使 用 压力 选项 ) , 这 样 绘制 出 的 线条 会 根据 压力 的 大 小 而 产生 不 同 的 粗细 效 
果 (图 3-6) 。 


图 3-5 绘制 人 物 的 外 轮廓 图 3-6 使 用 压 感 笔 绘 制 的 效果 


小 偷 快 跑 | 


Step 4 “” 单 击 & 填 充 工 具 ， 选 择 自己 喜爱 的 颜色 对 人 物 进行 填充 ， 如 图 3 一 7 所 示 


不 封闭 任何 区 域 


封闭 较 小 缺口 


封闭 中 等 缺口 


Y 加 Close Medium Gaps 


包 | Close Large Gaps 


封闭 较 大 缺口 


图 3-8 设置 缺口 宽度 


3.2 制作 影片 片段 


Step 1 在 第 3 帧 上 插入 一 个 关键 帧 ， 并 适当 地 将 手 、 脚 
和 汗 珠 的 位 置 进行 一 些 移动 , 最 好 再 制作 一 个 投影 增加 真实 性 ， 
以 此 形成 可 循环 播放 的 影片 片段 .也 许 初学 者 这 时 候 对 影片 片段 
的 概念 还 不 是 很 了 解 , 没关系 , 继续 后 面 的 学 习 , 相信 你 很 快 就 
会 完全 掌握 的 . (图 3-9) 。 


图 3-9 循环 播放 的 影片 片段 
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Step 2 按 EEBE9 回 到 主场 景 ， 按 快捷 键 Ctrl+L 打开 Library (文件 库 ) 面板 ， 将 刚刚 
做 好 的 影片 片段 拖 入 场景 中 。 新 建 一 个 图 层 并 命名 为 “地 面 ， 如 图 3-10 所 示 , 然后 将 它 放 


置 在 最 底层 。 


图 3-10 新 建 一 个 图 层 


Step 3 使 胜 铅笔 工具 在 “地 面 ”图 层 中 绘制 出 地 面 的 形状 (图 3-11)。 


CA 


图 3-11 绘制 地 面 


Step 4 ”使 用 感 油污 桶 工具 对 地 面 进行 填充 ， 在 Color Mixer 面板 中 将 填充 方式 设置 为 
Linear (线性 ) 填充 ， 然 后 设置 前 景色 为 六 20262F， 背 景色 为 站 D5D3EF (图 3-12) 


T Color Mixer 
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[sososEF 


3-12 Color Mixer 面板 


Step 5 ”这 时 候 如 果 发 现 填充 的 方向 不 正确 ， 可 以 使 用 明 工具 对 填充 色 进 行 调 整 ， 最 
后 按 F8 键 将 地 面 图 形 转 为 Symbol， 如 图 3-13 所 示 。 


图 3-13 对 填充 色 进 行 调整 


Step 6 ”新 建 一 个 图 层 ， 用 相同 的 方法 绘制 出 远 处 的 房子 。 我 想 通过 前 面 的 学 习 ， 大 
家 对 绘图 工具 和 绘图 方法 都 有 了 一 定 的 了 解 ， 房 子 的 绘制 应 该 不 在 话 下 吧 ! 最 后 效果 如 图 
3-14 所 示 。 


图 3-14 绘制 出 远 处 的 房子 


3.3 ”制作 移动 引导 线 


Step 1 首先 按 F5 键 将 所 有 图 层 的 时 间 轴 都 延长 至 100 帧 处 ， 然 后 用 鼠标 右键 单 击 
-小偷 ”图 层 ， 在 弹出 的 菜单 中 选择 Add Motion Guide 增加 引导 线 图 层 (图 3-15) 。 


1600 jz20fs 1 683 可 


图 3_15 增加 引导 线 图 层 
Step 2 在 引导 线 图 层 中 ， 使 用 艺 工 具 顺 着 地 面 的 起 伏 绘制 一 条 曲线 ， 如 图 3-16 所 


图 3-16 绘制 引导 线 


Step 3 ”要 想 让 引导 线 起 作用 ， 需 要 设置 起 点 和 终点 。 单 击 “ 小 偷 ” 图 层 的 第 1 帧 ， 
使 用 * 工具 将 图 形 的 中 心 点 移动 到 引导 线 的 起 点 处 (图 3-17)。 


图 3-17 设置 起 点 


Step 4 在 当前 层 的 第 100 帧 处 增加 一 个 关键 帧 ， 然 后 将 图 形 的 中 心 点 拖 动 到 引导 线 
的 终点 ， 如 图 3-18 所 示 。 


图 3=18 设置 终点 


Step 5 ”用 鼠标 右键 单 击 当 前 图 层 的 第 1 帧 , 在 弹出 的 菜单 中 选择 Create Motion Tween 
产生 移动 渐变 动画 。 按 下 Enter 键 预览 Timeline, 就 可 以 看 到 小 偷 随 着 你 绘制 的 引导 线 奔 跑 的 
动画 了 。 如果 动画 不 正常 ,很 可 能 是 你 的 起 点 或 终点 没有 对 齐 , 调整 一 下 吧 . 最 后 效果 如 图 
3 一 19 所 示 。 


图 3-19 预览 动画 


Step6 我们 的 画面 似乎 还 缺点 什么 , 增加 一 个 移动 的 月 亮 作为 远 处 的 背景 或 者 利用 
所 学 的 知识 ， 做 一 些 随 风 球 动 的 雪花 吧 。 图 3-20 所 示 就 是 添加 月 亮 和 雪花 后 的 效果 。 


图 3-20 丰富 画面 后 的 效果 


3.4 小 结 


当 完 成 这 个 动画 的 制作 后 ,我 们 又 掌握 了 两 项 基本 的 技巧 : 移动 引导 线 和 影片 片段 的 应 
用 。 引 导线 的 作用 比较 容易 理解 , 在 此 就 不 再 多 介绍 了 。 还 是 重点 谈 谈 影 片 片段 的 作用 吧 
我 们 将 一 个 包含 自身 动画 的 影片 片段 镶 族 在 主 电影 当中 , 这 样 在 同一 时 间 内 , 这 两 个 不 同 的 
动画 就 会 独立 运行 ， 彼 此 不 相 冲突 (本 章 中 ,小 偷 奔 跑 就 是 一 个 简单 的 影片 片段 } 。 合 理 地 
运用 此 功能 ， 往 往 可 以 制作 出 非常 眩 目 的 视觉 效果 。 


Mask ( 遮 置 ) 动画 的 魅力 


( 周 熟练 运用 遮 罩 技 巧 制作 动画 效果 
( 千 如 何 将 导入 的 点 阵 图 形 转 换 成 矢量 图 


( 周 如 何 通过 Mask 功能 创作 出 丰富 多 彩 的 视觉 效果 


这 是 一 个 简单 的 Mask ( 遮 罩 ) 动画 效果 ， 在 背景 图 的 衬托 下 ， 可 以 看 到 一 缕 辉 光 从 
“COOL ”字样 上 面 一 内 而 过 ， 非 常 肪 目 ! 如 图 4-1 和 图 4 一 所 示 。 


图 4-1 成 品 效果 之 一 图 4-2 成 品 效果 之 二 


因 国 曲 国 


LS 站 MX 经 


典 作 


| 操作 步骤 


4.1 制作 背景 图 层 


Step 1 启动 Flash MX， 建 立 一 个 新 的 文件 。 在 Properties 面板 中 设置 Size 为 400 x 
300Pixels，Frame Rate (速率 ) 为 12 帧 / 秒 (图 4-3)。 


四 一 区 有 让 三 一 二 和 


图 4-3 Properties 面板 


| FrameFaie: 加 fps 


双击 “Layer 1” 图 层 ， 将 它 改名 为 “背景 "。 选 择 File | Import { 导 入 ) 命令 ， 在 附 赠 
的 光盘 中 找到 素材 | 水 .jpg 文件 ， 将 此 图 导入 场景 中 并 使 用 豆 缩 放 工具 将 它 调整 到 合适 大 
小 ， 如 图 4-4 所 示 。 


ES 


4-4 导入 图 片 


Step 2 ”选中 导入 的 图 片 ， 选 择 Modify | Trace Bitmap 命令 ， 在 弹出 的 对 话 框 中 按 图 
4--5 所 示 进 行 设置 ， 最 后 结果 如 图 4-6 所 示 。 


图 4-5 Trace Bitmap 对 话 框 图 4-6 转化 效果 


Step 3 新建 一 个 图 层 ， 使 用 A 工具 在 场景 中 输入 “COOL ”字样 (图 4-7)， 然 后 按 
F8 将 文字 图 形 转 为 Symbol (元 件 )， 如 图 4-8 所 示 。 


Behavior: 广 Wovie Clip 。 Registrati 
广 Button 


下 Ahavaneed | teap | 
图 4-7 输入 文字 图 4-8 转 为 Symbol 


Step 4 按 F5 键 将 两 个 图 层 的 时 间 轴 延长 至 30 帧 处 (图 4-9)。 


图 4-9 延长 时 间 轴 


4.2 制作 阴影 遮 罩 效果 


Step 1 新 建 一 个 图 层 起 名 为 “COOL- 阴影 ， 将 它 放 置 在 “COOL 图 层 之 下 ， 如 图 
4--10 所 示 。 


Timeline 


图 4-10 新 建 一 个 图 层 


单 击 A 工 具 ， 将 填充 色 的 R、 G、B 值 设置 为 51、51、51， 在 当前 层 输 入 “COOL 字样 
并 移动 至 文字 的 右 下 方 作为 阴影 ， 最 后 将 文字 阴影 转 为 一 个 Symbol (图 4-11)。 


图 4-11 制作 阴影 


Step 2 在 “COQL- 阴影” 图 层 之 上 新 增 一 个 “ 遮 站 ” 图 层 ， 使 用 口 工具 在 场景 中 绘 
制 两 个 无 边框 的 白色 矩形 , 然后 按 F8 键 将 它 转 为 一 个 Symbol 并 移动 至 图 4-12 所 示 的 位 置 。 


Tooks Timeline 


图 4-12 绘制 两 个 矩形 


Step 3 ” 按 F6 键 在 当前 层 的 第 30 帧 上 插入 一 个 关键 帧 ， 将 两 个 矩形 向 右 移动 (图 
4--13)。 


图 4-13 向 右 移 动 矩 形 


Step 4 用 鼠标 右键 单 击 当前 层 的 第 1 帧 ， 在 弹出 的 菜单 中 选择 Create Motion Tween 
(创建 移动 渐变 动画 ), 如 图 4-14 所 示 。 按 下 Enter 键 预览 Timeline, 最 后 效果 如 图 4-15 所 示 。 


图 4-]4 生成 Motion Tween 图 4-15 预览 效果 


Step 5 下面 我 们 来 制作 最 精彩 的 Mask 效果 。 用 鼠标 右键 单 击 “ 遮 章 ” 图 层 ， 在 弹 
出 的 菜单 中 选择 Mask 选项 ， 结 果 如 图 4-16 所 示 。 


Timeline 


丰 大 大 是 下 本 于 所 二 工 训 下 页 下 矶 工 工 二 所 下 不 基 丰 下 于 基站 珊 生 左下 


到 三 | 和 加 | 
图 4-16 制作 Mask 效果 


天 有 人 往 遮 重 范 围 内 的 部 分 
被 诞生 图 形 的 颜色 。 


4.3 制作 高 光滑 过 的 效果 


Step 1 制作 高 光 遮 曾 和 制作 阴影 遮 章 的 方法 相似 ， 在 此 就 不 做 重复 了 ， 只 介绍 一 下 
几 个 关键 的 地 方 。 新 建 一 个 图 层 ， 使 用 念 工 具 在 场景 中 输入 “COOL ” 字样， 设置 填 充 色 的 
R、G、B 值 设置 为 : 255、255、255， 然 后 将 文字 图 形 移动 至 图 4-17 所 示 的 位 置 并 按 F8 键 
将 它 转 为 一 个 Symbol。 


图 4-17 新 建 图 层 


Step 2 ”按照 制作 阴影 遮 罩 的 方法 制作 高 光 遮 单 效果 ， 最 后 Timeline (时 间 轴 ) 状态 
如 图 4-18 所 示 。 


到 可 对 本 站 FE20W Too 可 
图 4-18 Timeline ( 时间 轴 ) 状态 
Step 3 按 Ctrl+Enter 键 进 行 预览 ， 就 可 以 看 到 一 道 高 光 和 投影 从 文字 上 滑 过 的 动画 
效果 了 ， 再 配 上 些 音乐 ， 是 不 是 很 漂亮 呢 ; 如 图 4 一 19 所 示 。 


图 4-19 最 终 效果 


4.4 小 结 

通过 本 章 的 制作 过 程 可 以 了 解 : Mask ( 遮 罩 ) 是 一 个 比较 简单 的 功能 , 但 它 却 能 产生 丰 
富 多 彩 的 视觉 效果 。 遮 罩 本 身 形状 . 大 小 以 及 运动 方式 的 不 同 , 再 加 上 被 壶 罩 物 体 自身 的 形 
状 、 色 彩 、 透 明度 和 运动 的 变化 ， 可 以 组 合 出 很 多 令 人 震惊 的 动画 效果 。 


四 多 钊 国 


恐龙 变形 动画 
本 章 重 点 


深入 学 习 Flash MX 中 各 种 绘图 方法 与 技巧 

如 何 制 作 基本 的 Shape (形状 ) 变形 动画 

了 解 变形 动画 的 前 提 条 件 一 一 打 散 图 形 的 群 组 关系 
如 何 控制 影片 播放 速度 


深入 了 解 并 合理 利用 Library 图 库 的 资源 


在 淡淡 的 天 空 背 景 之 下 ,两 只 恐龙 相互 渐变 成 对 方 , 这 其 中 的 奥秘 就 是 利用 了 Flash 中 
的 Shape (形状 ) 变形 动画 (图 5-1 一 图 5-4) 。 


图 5-1 动画 效果 之 一 图 5-2 动画 效果 之 二 
CR | CRTRRTDEESsassse 


图 5-3 动画 效果 之 三 图 5-4 动画 效果 之 四 


四 四 曲 国 
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第 1 篇 
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网 络 动画 篇 


操作 步骤 


5.1 绘制 背景 图 


Step 1 启动 Flash MX， 新建 文档 。 在 Properties (属性 ) 面板 中 设置 ee X 
350Pixels，Background (背景 色 ) 为 共 SCDF5FE，Frame Rate (速率 ) 为 20 帧 / (图 5 一 5) 。 


Size。。 550%350piueks | Baskgomd [| FameRae [0 古 
台 帮 ao | Pubth Fuzpue | 二 


图 5-5 Properties 面板 


[影片 12 帧 ， 如 果 想 让 


Step 2 ”双击 Layer 1 改名 为 “背景 "。 单 击 元 铅笔 工具 ， 将 Options 面 版 中 的 Pencil 
Mode 设 置 为 Smooth (光滑 ) 方式 (图 5-6)， 然 后 在 场景 中 绘制 出 山峰 的 外 轮廓 ,注意 要 让 
轮廓 形成 封闭 的 空间 以 便于 填充 颜色 ， 如 图 5-7 所 示 。 


图 5-6 设置 Smooth 方式 图 5-7 绘制 山峰 轮廓 


Step 3 单 击 吨 填 充 工 具 ， 设 置 填充 色 的 R、G、B 为 255、255、204 (图 5-8) 。 填 充 
后 使 用 国 工 具 将 图 形 的 外 轮廓 选择 并 删除 ， 最 后 效果 如 图 5-9 所 示 。 


图 5-8 设置 填充 色 图 5-9 删除 外 轮廓 
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图 5-10 绘制 阴影 效果 


5.2 绘制 主角 一 一 两 只 恐龙 


Step 1 按 Ctrl+F8 组 合 键 创 建 一 个 新 的 Symbol， 在 弹出 的 Create New Symbol 对 话 
框 中 按 图 5--12 所 示 进 行 设置 。 


Create New Symbol 


rs Ce 
Behavior: 人 三 Wovie Clip Cancel | 
人 矿 Batton 
Chic Advanced | Help | 


5-12 创建 Symbol 


Step 2 使 用 殉 工 具 在 场景 中 绘制 恐龙 的 外 形 (图 5-13)。 如 果 想 得 到 更 加 圆滑 的 曲 
线 ， 可 以 使 用 辐 工 具 对 线条 进行 深入 的 调整 ， 如 图 5-14 所 示 。 


图 5-13 绘制 丽 龙 图 5-14 对 线条 进行 调整 


Step 3 单 击 题 工具， 设置 填充 色 为 共 66FF00， 然 后 对 丽 龙 身体 进行 填充 。 眼 睛 部 分 
可 以 使 用 自己 喜欢 的 色彩 ， 这 里 就 默认 为 白色 了 (图 5-15) 。 
Step 4 ”使 用 工 具 继续 绘制 细节 ， 最 后 效果 如 图 5-16 所 示 。 
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图 5-15 填充 色彩 图 5-16 绘制 细节 


Step 5 按 Ctrl+F8 组 合 键 创建 一 个 Symbol， 在 弹出 的 对 话 框 中 按 图 5-17 进行 设置 。 


Bashavior: 和信 Wovie Clip Cancel 
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图 5-17 创建 Symbol 


Step 6 ”第 二 只 丽 龙 与 第 一 只 和 恐龙 的 绘制 方法 相同 ， 在 此 就 不 一 一 重复 了 ， 关 键 过 程 
如 图 5-18 一 图 5 一 21 所 示 。 


图 5-18 绘制 轮廓 图 5-19 填充 整体 色彩 


图 5-20 填充 局 部 色彩 图 5-21 绘制 细节 


到 此 为 止 ， 这 两 只 看 起 来 有 些 搞笑 的 恐龙 就 绘制 完成 了 。 
5.3 制作 变形 动画 


Step 1 返回 主场 景 (图 5-22)， 新 建 一 个 “ 丽 龙 ”图 层 ， 按 F5 键 将 两 个 图 层 的 时 间 
轴 延 长 至 第 55 帧 ， 如 图 5-23 所 示 。 


ERa 村 


图 5-22 返回 主场 景 图 5-23 延长 时 间 轴 


Step 2 按 Ctrl+L 组 合 键 调 出 Library， 将 “恐龙 1” 元 件 拖 入 场景 中 ， 如 图 5-24 所 


图 5-24 拖 入 场景 


Step 3 ”在 当前 图 层 第 3、 第 4、 第 8、 第 9、 第 15 帧 处 分 别 插入 关键 帧 (图 5-25) 。 
使 用 * 工具 将 第 3 和 第 8 帧 中 的 恐龙 图 形 向 上 移动 , 按 Enter 键 预览 Timeline， 形 成 恐龙 跳动 
的 动画 ， 如 图 5-26 所 示 。 


四 四 划 国 
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网 络 动画 篇 


图 5-25 插入 关键 帧 图 5-26 将 第 3、8 帧 中 的 恐龙 图 
形 向 上 移动 
Step 4 单 击 当前 层 的 第 20 帧 ， 然 后 按 CtrlI+B 组 合 键 将 恐龙 图 形 打 散 (图 5-27 和 图 


5 一 28j)。 


| 图 5-27 未 打 散 效果 图 5-28 打 散 效果 


Step 5 “在 第 40 帧 处 插入 一 个 关键 帧 ， 
按 CtrI+L 组 合 键 打开 Library 并 调 入 “ 丽 龙 2 元 
件 ， 然 后 将 “ 丽 龙 1” ”删除 (图 5 一 29 ) 。 


图 5-29 调 入 元 件 


Step 6 在 当前 层 的 第 45、 第 46、 第 50 和 第 51 帧 上 分 别 插入 关键 帧 ， 使 用 * 工具 将 
第 45、50 帧 中 的 恐龙 图 形 向 上 移动 ， 同 样 形成 恐龙 跳动 的 动画 ， 如 图 5-30 所 示 。 


图 5-30 将 第 45 和 第 50 帧 中 的 恐龙 图 形 向 上 移动 


Step 7 单 击 第 40 帧 ， 按 Ctrl+B 组合 键 将 恐龙 图 形 打 散 。 单 击 第 15 帧 ， 在 Properties 
面 版 中 将 Tween 设置 为 Shape (形状 ) 变形 动画 (图 5-31)， 最 后 结果 如 图 5-32 和 图 5 一 33 
所 示 。 


图 5-32 变形 动画 效果 一 


EECETIREIORERENEINEINE 
se [| 


[ 员 一 


和 国 Somel 


图 5-33 变形 动画 效果 二 


5.4 丰富 动画 视觉 效果 


| 这 一 步 的 目的 主要 是 丰富 动画 的 视觉 效果 并 突出 主角 , 例如 增加 阴影 . 浮云 等 等 。 通过 
前 几 章 的 学 习 ， 大 家 对 绘图 工具 和 方法 都 比较 熟悉 了 ， 制 作 这 些 简单 的 动画 应 该 不 成 问题 
吧 
Step 1 新 建 “ 阴 影 ”图 层 ， 将 它 放 置 在 “恐龙 ”图 层 之 下 。 使 用 口 工 具 绘制 一 个 椭 
圆 作 为 阴影 ， 并 配合 恐龙 的 变形 动画 制作 出 阴影 的 变化 (图 5-34) 。 


Tenele 


图 5-34 绘制 阴影 


Step 2 ” 当 恐 龙 跳 起 时 ， 可 以 使 用 入 工具 将 阴影 图 形 缩小 ,如 图 5-35 和 图 5 一 36 所 示 。 


图 5-35 调 小 阴影 图 5-36 调 大 阴影 


Step 3 ”再 制作 出 一 片 浮云 际 动 的 动画 ， 或 者 根据 自己 的 想像 力 随 意 添 加 吧 ， 最 终 效 
果 如 图 5-37 所 示 。 


5-37 最终 效果 


所 有 的 制作 完成 后 ， 选 择 File | Export Movie 命令 输出 成 .Swf 格式 的 文件 ， 这 样 一 个 
完整 的 动画 就 制作 完成 了 。 


5.5 “小 结 


本 章 介 绍 了 一 个 新 的 动画 形式 一 一 Shape 变形 动画 。 相 信 大 家 对 Flash MX 的 动画 形式 
都 有 了 一 定 的 了 解 。 在 制作 过 程 中 , 又 介绍 了 各 种 绘图 工具 的 使 用 方法 .改变 影片 播放 速度 
以 及 怎样 合理 地 利用 Library 等 等 。 希望 大 家 能 够 运用 目前 所 学 到 的 知识 , 举一反三 , 创作 出 
更 加 优秀 的 动画 短片 。 


章 BT | 
本 章 重点 


利用 Flash MX 中 的 填充 工具 制作 逼真 的 光 旱 


通过 调节 Alpha 数 值 来 模拟 柔软 、 有 泵 胱 的 灯光 效果 
如 何 反 复 利用 元 件 并 组 合 出 复杂 的 视觉 效果 
用 简单 的 技术 和 色彩 搭配 制作 出 令 人 印象 深刻 的 动画 


将 影片 片段 装载 到 主场 景 中 形成 反复 循环 的 影片 动画 


| 预览 成 品 | 


寂静 的 黑夜 里 , 街 边 的 一 昔 路 灯 呈 现 出 忽 暗 忽 亮 的 光学 效果 , 腊 胱 的 灯光 与 深蓝 色 的 天 
空 形成 的 色彩 对 比 深 深 地 吸引 了 我 ..，.…… .， 效果 如 图 6-1 和 图 6-2 所 示 。 


CITIES =|Di xl 
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图 6-2 成品 效 果 之 二 


| 操作 步骤 | 


6.1 绘制 背景 图 
Step 1 启动 Flash MX , 新 建 一 个 文档 。 在 Properties 面 板 中 设置 Size 为 550 x 350Pixels ， 


Background (背景 色 ) 为 共 6666CC (图 6-3) 。 
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图 6-3 在 Properties 面板 中 设置 参数 


Step 2 ”双击 Layer 1 命名 为 “背景 "。 使 用 工具 在 场景 中 绘制 出 远 处 建筑 的 外 轮 
廓 。 然 后 单 击 术 工具 ,设置 填 充 色 为 #455C89， 填 充 后 将 图 形 的 外 轮廓 删除 ， 最 后 效果 如 
图 6 一 4 所 示 。 


图 6-4 绘制 远 处 建筑 


Step 3 单 击 园 橡 皮 工 具 ， 设 置 其 形状 为 方形 (图 6-5) ， 然 后 在 场景 中 擦 出 窗户 的 
轮廓 ， 如 图 6-6 所 示 。 


图 6-5 设置 形状 图 6-6 控 出 窗户 轮廓 


6.2 绘制 路 灯 


Step 1 按 Ctrl+F8 组 合 键 创 建 一 个 新 的 Symbol， 命 名 为 “路 灯 。 使 用 台 工 具 在 场景 
中 绘制 出 路 灯 的 外 轮廓 (图 6-7)。 

Step 2 ”使 用 工具 画 出 路 灯 的 明暗 交界 线 ， 并 使 用 * 工具 调整 曲线 的 圆滑 度 (图 
6 一 8 ) 。 


6-8 调整 曲线 的 圆滑 度 


Step 3 ” 单 击 机 工具， 设置 填充 色 的 R、G、B 为 66、89、159， 填充 图 6-9 所 示 的 部 
分 ， RGB 为 128、152、202 填充 图 6-10 所 示 的 部 分 ，RGB 为 254、230、160， 填 充 图 6 一 
11 所 示 的 部 分 ,RGB 为 255.、 255、204 填充 图 6-12 所 示 的 部 分 ,RGB 为 254.215、 97 填 
充 图 6-13 所 示 的 部 分 ， 到 此 为 止 ， 路 灯 的 绘制 全 部 完成 。 


于 


| 


图 6-9 填充 颜色 图 6-10 填充 颜色 


图 6-12 填充 颜色 图 6-13 填充 颜色 


6.3 制作 光 晕 效果 


Step 1 创建 一 个 新 的 Symbol， 命名 为 “ 光 晕 。 单 击 & 工具 ， 在 Color Mixer 面板 中 
设置 填充 方式 为 Radial ( 圆 形 渐变 ), 并 设 定 第 一 个 色 标 为 淡 黄 色 , 第 二 个 色 标 为 背景 色 (图 


6-14)。 
Step 2 ”将 第 二 个 色 标 的 Alpha (透明 度 ) 设置 为 0， 以 便 使 光 旱 能 够 逐渐 淡化 并 融入 
到 背景 颜色 中 (图 6-15) 。 


图 6-14 设置 填充 方式 图 6-15 设置 Alpha 


Step 3 单 击 工具 ,将 Stroke Color 指定 为 None (不 描 边 线 ) ， 如 图 6-16 所 示 。 然 
后 配合 Shift 键 在 场景 中 拖 出 一 个 圆 形 ， 这 样 就 得 到 了 一 个 非常 柔和 的 晕 光 (图 6-17)。 


图 6_16 不 描 边 线 图 6-17 创建 柔和 的 学 光 


Step 4 下 面 来 制作 旱 光 的 光线 。 按 CtrlI+F8 组 合 键 建立 一 个 新 的 Symbol , 命名 为 “ 光 
线 ， 使 用 操 工 具 在 场景 中 绘制 出 一 个 细 长 的 矩形 ， 最 后 晕 光 光线 的 效果 如 图 6--18 所 示 。 


图 6-18 晕 光 光线 


Step 5 ”继续 按 Ctrl+F8 组 合 键 建立 一 个 Symbol , 命名 为 “光线 组 合 .然后 打开 Library ， 
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将 刚刚 绘制 好 的 “光线 ”元 件 重复 拖 入 场景 中 , 使 用 去 工具 调整 各 束 光 线 的 长 短 和 方向 (图 
6 一 19 ) 。 


图 6-19 调整 各 束 光线 
Step 6 在 Properties 面板 中 将 每 束 光线 的 Alpha 值 调 整 为 3396 (图 6-20)。 


Properties 


产 一 一 


[em 习 怕 | 


图 6-20 在 Properties 面板 中 设置 Alpha 值 


Step 7 ”再 新 建 一 个 Symbol， 命 名 为 “光圈 。 单 击 G 工具 ,将 Stroke Color 的 色彩 设 
为 共 FFFFCC ，Fill Color 设置 为 None， 如 图 6-21 所 示 。 然 后 配合 Shift 键 在 场景 中 拖 出 一 个 
圆 形 ， 这 样 就 得 到 了 一 个 没有 填充 色 的 圆 形 外 轮廓 (图 6 一 22) 。 


图 6-21 设置 填充 图 6-22 圆 形 外 轮廓 


6.4 制作 光 晕 渐变 的 动画 效果 


Step 1 按 Ctrl+F8 组 合 键 建立 一 个 Symbol， 起 名 为 “光一 动 画 ” 
(图 6-24)。 双 击 Layer 1 改名 为 “ 光 晕 ， 然 后 将 Library 中 的 “光量 
元 件 拖 入 到 场景 中 并 在 第 30、 第 60 和 第 75 帧 上 分 别 插入 关键 帧 ， 如 
图 6 一 25 所 示 。 


图 6-24 新 建 Symbol 图 6-25 插入 关键 帧 


Step 2 单 击 第 30 帧 ， 按 CtrlI+T 组 合 键 打开 Transform 面板 ， 在 弹出 的 对 话 框 中 按 图 
6--26 所 示 进 行 设置 ， 第 60 帧 处 设置 如 图 6 一 27 所 示 。 


图 6-26 Transform 面板 图 6-27 Transforrm 面板 


Step 3 ”以 鼠标 右键 单 击 第 1 帧 ， 选 择 Create Motion Tween 生成 动画 ， 单 击 第 30 帧 ， 
选择 光 晕 图 形 并 调整 Alpha 的 数值 为 59% ， 如 图 6-28 所 示 。 


图 6-28 调整 Alpha 
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Step 4 新 建 一 个 “光线 ”图 层 ， 将 Library 中 的 “光线 组 合 ” 元 件 拖 入 到 当前 层 中 并 
在 第 30、 第 60 和 第 75 帧 上 插入 关键 帧 ， 如 图 6-29 所 示 。 


图 6-29 拖 入 元 件 并 插入 关键 帧 


Step 5 按 Ctrl+T 组 合 键 打开 Transform 面板 ， 第 30、 第 60 和 第 75 帧 处 设置 分 别 如 
图 6-30、 图 6-31 和 图 6 一 32 所 示 。 


Transform 


Transform 渤 Transform 去 


嫩 | 100.0% 4 100.0% 


权 constrain 
他 Rotate 人 么 


1 总 一 15.0 
图 6-30 在 Transform 面板 中 图 6-31 
设置 第 30 帧 参数 


在 Transform 面板 中 
设置 第 60 帧 参数 


图 6-32 在 Transform 面板 中 
设置 第 75 帧 参数 


Step6 ”将 第 1. 第 30. 第 60 和 第 75 帧 中 光线 图 形 的 Alpha 值 分 别 调整 为 36926、12 儿 、 
4596 和 259%6， 最 后 生成 Motion Tween 动画 (图 6-33) 。 


所 


6-33 设置 Alpha 生成 Motion Tween 动画 


Step 7 ”使 用 同样 的 方法 将 光环 图 层 的 动画 效果 制作 完成 (图 6-34)， 按 下 Enter 键 预 
览 Timeline， 就 会 呈现 出 忽 暗 忽 亮 的 光 晕 效果 了 。 


图 6-34 光 晕 效果 


6.5 ”合成 影片 


Step 1 单 击 EEBEEE 回 到 主场 景 ， 新 建 “背景 、 路 灯 和 “ 光 晕 ” 图 层 ， 并 分 别 将 
Library 中 与 之 相对 应 的 元 件 拖 入 其 中 ， 如 图 6-35 所 示 。 
Step 2 ”根据 自己 的 想像 力 继续 丰富 影片 ， 例 如 添加 一 些 闪 烁 的 星星 (图 6-36 ) 。 


图 6-35 新 建 图 层 图 6-36 丰富 影片 


所 有 的 制作 都 完成 了 ， 按 下 Ctrl+Enter 组 合 键 进 行 预览 吧 ， 当 一 切 都 满意 后 别 忘 了 按 
Shift+F12 组 合 键 进行 输 出 。 


6.6 小结 


通过 本 章 的 学 习 ， 我 们 已 经 掌握 了 制作 Flash 短片 的 基本 思路 和 步骤 ,也 学 会 了 更 多 的 
制作 经 验 和 技巧 。 在 这 里 我 想 说 的 是 , 学 习 软 件 是 为 了 更 好 的 表达 自己 的 感受 和 创意 等 等 ， 
它 只 是 我 们 进行 艺术 创作 的 一 种 工具 ,而 不 能 让 技术 限制 和 制约 我 们 的 灵感 。 真 正 的 高 手 使 
用 目前 的 这 些 技术 ， 就 能 够 制作 出 令 人 震惊 的 动画 效果 了 。 
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( 周 如 何 制作 逐 帧 渐变 动画 


( 周 了 解 元 件 重复 利用 的 优势 
( 千 通过 不 同 的 动画 制作 方式 呈现 出 丰富 多 变 的 效果 


( 辕 使 用 Flash MX 的 矢量 绘图 工具 来 模拟 真实 的 阴影 


这 个 实例 主要 讲述 了 如 何在 Flash MX 中 制作 出 阴影 效果 ,如 图 7-1 和 图 7 一 2 所 示 , 我 
们 将 来 可 以 把 这 种 制作 技巧 应 用 到 其 他 动画 中 。 


图 7-1 成 品 效果 之 一 图 7-2 成 品 效果 之 二 


操作 步骤 
7.1 和 柔 化 边缘 阴影 的 制作 方法 


Step 1 首先 绘制 或 者 导入 一 个 图 形 ， 选 择 Modify | Trace Bitmap (转化 为 矢量 图 ) 
命令 ,然后 配合 Alt 键 用 鼠标 向 右 拖 动 复制 。 按 Ctrl+B 组 合 键 将 新 复制 的 图 形 打 散 ， 如 果 该 
图 形 结 构 复 杂 ， 需 要 多 次 执行 打 散 命令 (图 7-3)。 


图 7-3 打 散 图 形 


Step 2 ”使 用 巧 工 具 将 打 散 的 图 形 填 充 为 深 灰 色 。 选 择 菜 单 Modify | Shape | Soften 
Fill Edges 命 令 ., 在 弹出 的 对 话 框 中 按 图 7--4 所 示 进 行 设置 , 然后 将 它 放置 在 原 图 形 的 后 面 ， 


最 后 效果 如 图 7-5 所 示 。 


[sonenredoes 
Distance' F px 
anber of P Cancel | 
Direction; (> Bxpand 
庆 Te Help | 
7-4 Soften Fill Pdges 图 7-5 和 柔 化 阴影 


和 柔 化 边缘 阴影 的 制作 方法 非常 简单 ， 但 由 于 Flash 属于 矢量 绘图 软件 ， 因 此 它 所 制作 出 
来 的 阴影 效果 , 无 法 与 点 阵 图 的 阴影 效果 相 媲 美 。 矢量 图 形 是 由 数学 函数 运算 成 图 , 所 以 层 
次 单一 ， 缺 乏 材 质 的 细腻 感 ， 但 也 正 因为 如 此 ， 其 文件 也 明显 小 了 很 多 。 


7.2 阴影 渐变 动画 的 制作 方法 


Step 1 启动 Flash MX , 新 建 一 个 文档 。 在 Properties 面 板 中 设置 Size 为 450 x 200Pixels 
Frame Rate 为 20 帧 /“ 秒 。 选择 File | Import (导入 ) 命令 , 在 附 赠 的 光盘 中 找到 素材 | 阴影 一 
“2.Png 文件 ， 并 使 用 政工 具 将 图 形 调整 到 合适 大 小 (图 7-6)。 


有 入 生生 站 影 未 帧 渐 交 的 效果 


图 7-6 导入 图 形 
Step 2 ”在 第 5 帧 上 插入 一 个 关键 帧 ， 选 中 图 片 后 配合 Alt 键 用 鼠标 向 右 拖 动 复制 ， 
单 击 Modify | Trace Bitmap 命令 ， 在 弹出 的 对 话 框 中 按 图 "一 7 所 示 进 行 设置 ， 最 后 效果 如 
图 7--8 所 示 。 


ca 
有 nimom Area: PP pixels Cancel | 


cuvePit na 司 
Coraer frrmua 司 kelp | 


7-7 Trace Bitmap 7-8 Trace Bitmap 后 的 效果 


Step 3 ” 单 击 吨 工 具 ， 设 置 填充 色 为 共 999999， 然 后 对 被 打 散 的 图 形 进 行 填充 ， 再 按 
快捷 键 F8 将 它 转 为 Symbol (图 7-9)。 选 择 Modify | Arrange | Send to Back (放置 在 最 底 
层 ) 命令 ， 然 后 移动 到 如 图 ?10 所 示 的 位 置 。 


[Convert to Symbol 
RE 
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图 7-9 转 为 Symbol 图 7-10 放置 在 最 底层 


Step 4 在 第 7 帧 插入 一 个 关键 帧 , 将 Library 中 的 “阴影 元 件 拖 入 场景 中 并 在 Froperties 
面板 中 按 图 7 一 11 所 示 进 行 设置 。 


BF 四 
网 的 井 国 
h MX 经 典 作 品 : 


1 At 


第 1 


eewe 


[En 习 pef [了 后 本 
图 7-11 将 元 件 拖 入 场景 中 


Step 5 选择 Modify | Arrange | Send to Back (放置 在 最 底层 ) 命令 后 将 它 移动 到 如 
图 7--12 所 示 的 位 置 。 


图 7-12 放置 在 最 底层 


Step 6 在 第 9 帧 插入 一 个 关键 帧 ， 同 样 将 “阴影 ”元 件 拖 入 场景 中 并 在 Properties 面 
板 中 按 图 7--13 所 示 进 行 设 置 。 选 择 Modify | Arrange | Send to Back 命令 后 将 它 移动 到 如 
图 7--14 所 示 的 位 置 。 


回 Ee 7 ae Tc 


ET 
图 7-13 在 Properties 面板 中 设置 参数 


图 7-14 放置 在 最 底层 


近 ， 所 得 到 的 阴影 效果 束 更 加 的 真实 、 细 用 


Step 7 ”在 第 11 帧 上 插入 一 个 关键 帧 ， 将 “阴影 ”元 件 拖 到 场景 中 ， 在 Properties 面 
板 中 按 图 7--15 所 示 进 行 设 置 。 选 择 Modify | Arrange | Send to Back 命令 后 将 它 移动 到 图 
7-16 所 示 的 位 置 。 


aaneeot 并 及 [IE 
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图 7-15 在 Properties 面板 中 设置 参数 


图 7-16 放置 在 最 底层 
Step 8 按 同样 的 方法 继续 制作 ， 最 后 结果 如 图 7-17 所 示 。 
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图 7-17 最 后 效果 
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本 章 所 介绍 的 主要 内 容 , 并 不 直接 和 制作 动画 有 关 .。 但 这 是 非常 重要 的 一 个 基础 , 通过 
它 我 们 可 以 更 加 深入 地 了 解 Flash， 了 解 元 件 的 应 用 等 等 。 有 了 这 个 基础 ， 对 将 来 制作 复杂 
动画 会 有 很 大 的 帮助 。 

下 面 来 回顾 一 下 制作 阴影 的 方法 : 

(1 六 柔 化 边缘 方式 。 这 种 方法 可 以 使 阴影 呈现 出 模糊 腊 胱 的 感觉 ,但 由 于 元 件 被 打 散 ， 
破坏 了 其 群 组 关系 ， 所 得 到 的 文件 会 很 大 。 

(2) 阴影 渐变 方式 。 不断 复 制 元 件 , 为 每 一 个 元 件 设置 深浅 不 一 的 灰色 , 并 以 微小 间距 
整齐 的 排列 ， 于 是 便 呈 现 出 深浅 渐变 的 阴影 效果 。 而 文件 并 不 会 因为 元 件 的 重复 复制 而 增 
大 ， 因 为 元 件 不 会 依照 复制 的 次 数 而 累计 文件 大 小 ， 这 就 是 重复 利用 元 件 的 好 处 。 
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如 何 制作 有 声 有 色 的 动画 短片 

利用 Actions 编辑 出 可 循环 播放 的 动画 

通过 制作 多 层次 的 动画 效果 来 模拟 真实 的 降雨 
如 何 使 声音 文件 循环 播放 


了 解 创 作 复杂 动画 的 思考 过 程 和 方法 
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图 8-1 成 品 效果 之 一 图 8-2 成 品 效果 之 二 
操作 步骤 
8.1 绘制 所 需要 的 素材 
Step 1 启动 Flash MX， 新 建 一 个 空白 文档 。 在 Properties (属性 ) 面板 中 设置 Size 为 


四 鸭 葛 国 
h MX 经 典 作 品 


370 x 280Pixels ， Frame Rate (速率 ) 为 24 帧 / 秒 (图 8-3)。 


Properties 


A 


Dooanem 3708280piels | Backgound | -| FnamsRate |24 fs 
第 七 亚 坡 ?- Flash Plager 5 


图 8-3 在 Properties 面板 中 设置 参数 


Step 2 ”双击 Layer 1 改名 为 “背景 "。 使 用 口 工 具 绘 制 一 个 和 场景 同样 大 小 的 矩形 ， 
删除 外 轮廓 后 全 选 矩 形 ， 在 Color Mixer 面板 中 ,选择 Linear 线性 渐变 方式 (图 8-4)， 将 背 
景 设置 成 从 深蓝 到 白色 的 渐变 填充 ， 如 图 8--5 所 示 。 


和 Color Mixer 


图 8-4 Linear 线性 渐变 图 8-5 填充 背景 


Step 3 按 Ctrl+F8 组 合 键 创建 一 个 Symbol， 命 名 为 “房子 -1 ， 使 用 工具 在 场景 
中 绘制 出 如 图 8-6 所 示 的 房子 外 轮廓 。 


图 8-6 绘制 房子 轮廓 


Step 4 使 用 感 工具 对 图 形 进 行 填充 ， 然 后 用 如 工具 绘制 一 些 细节 ， 如 图 8-7 所 示 。 
Step 5 按 Ctrl+F8 组 合 键 创建 一 个 Symbol 并 起 名 为 “房子 -2 ， 使 用 相同 的 方法 继 
续 绘 制 (图 8-8 ) 。 
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图 8-7 绘制 细节 图 8-8 绘制 房子 图 形 


Step 6 ”继续 创建 两 个 Symbol (元 件 ) ， 分 别 命名 为 “房子 -3 和 房子 -4 并 绘制 
出 如 图 8-9 和 图 8--10 所 示 的 图 形 。 


图 8-9 绘制 房子 图 形 图 8-10 绘制 房子 图 形 


Step7 按 


2 按钮 回 到 主场 景 ， 新 建 4 个 图 层 ， 分 别 是 “房子 一 1 ”、“ 房 子 -2” 


“房子 -3” 和 “房子 -4"。 打 开 Library， 将 刚刚 绘制 的 4 个 Symbol 分 别 放 入 与 之 相对 应 的 层 
中 (图 8-11)。 


图 8-11 新 建 图 层 并 把 4 个 Symbol 放 入 相应 的 层 中 


Step 8 单 击 Timeline 面板 的 引 ] 建立 图 层 文件 夹 按钮 ， 将 4 个 房子 图 层 移动 到 文件 来 
中 ， 如 图 8--12 所 示 。 


图 层 进行 管理 可 以 提高 工作 效率 。 


Step 9 单 击 “ 房 子 -1” 图 层 ， 在 Properties 面板 中 设置 其 元 件 的 Alpha 为 90 为 ， 如 
图 8-13 所 示 。 


二 位 “一 一 
图 8-13 设置 元 件 的 Alpha 


Step 10 单 击 “ 房 子 -2” 图 层 ， 在 Properties 面板 中 设置 其 元 件 的 Alpha 为 6626 (图 
8 一 14) 。 


图 8-14 设置 元 件 的 Alpha 
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Step 11 分 别 设置 “房子 -3” 和 “房子 -4” 图 层 中 元 件 的 Alpha 为 50% 和 802%, 如 
图 8--15 和 图 8 一 16 所 示 。 
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图 8=-15 设置 元 件 的 Alpha 


图 8-16 设置 元 件 的 Alpha 


Step 12 新建 一 个 图 层 并 命名 为 “屏幕 “使 用 口 工具 在 场景 中 绘制 两 个 黑色 猎 形 (图 
8 一 17)。 


图 8-17 绘制 屏幕 
到 此 为 止 ， 一 幅 具 有 远近 虚实 、 不 同 层次 的 城市 背景 图 就 制作 完成 了 。 
8.2 制作 降雨 的 动画 效果 


Step 1 按 Ctrl+F8 组 合 键 创建 一 个 Symbol， 命 名 为 “前 层 雨 水 。 使 用 二 工具 在 场景 
中 绘制 出 如 图 8-18 所 示 的 雨滴 ， 并 按 F8 键 将 它 转 为 Symbol。 
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图 8-18 绘制 雨滴 


Step 2 在 第 10 帧 上 插入 一 个 关键 帧 ， 将 雨滴 向 左下 角 移 动 并 生成 Motion Tween 动 
画 ， 这 样 就 模拟 出 雨滴 下 降 的 效果 了 (图 8-19)。 


= Timeline 


也 认 世 全 省 到 直 刘 记 国 太 10 7 T24 


8-19 生成 Motion Tween 动画 


| Step 3 按 Ctrl+F8 组 合 键 创建 一 个 新 的 Symbol， 命名 为 “中 层 雨水 。 使 用 /“ 工具 在 
| 场景 中 绘制 一 条 斜 线 ， 然 后 按 F8 键 将 它 转 为 Symbol (图 8 一 20) 。 
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8-20 ”绘制 斜 线 


Step 4 在 第 15 帧 上 插入 一 个 关键 帧 ， 将 斜 线 向 左下 角 移 动 并 生成 Motion Tween 动 
画 (图 8 一 21) 。 


超 帮 如 全 疙 封 生 可 到 呈 [二 请 4608 
图 8-21 生成 Motion Tween 动画 


Step 5 继续 创建 一 个 Symbol， 命 名 为 “后 层 雨 水 "。 使 用 工具 绘制 出 图 8--22 所 示 

的 图 形 ， 并 按 F8 键 将 它 转 为 Symbol。 
(overtosymbol 
ER 
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图 8-22 绘制 图 形 
Step 6 ”在 第 20 帧 上 插入 一 个 关键 帧 ， 将 图 形 向 左下 角 移 动 并 生成 Motion Tween 动 


画 (图 8 一 23) 。 


图 8-23 生成 Motion Tween 动画 
8.3 合成 影片 


Step1 按 


SEE 按钮 回 到 主场 景 ， 新 建 3 个 图 层 和 1 个 文件 夹 ， 如 图 8-24 所 示 。 


Step 2 单 击 “前 层 雨水 ”图 层 ， 按 Ctrl+L 组 合 键 打开 library， 将 与 之 相对 应 的 元 件 
拖 到 场景 中 并 设置 Alpha 为 9096 (图 8-25) 。 


图 8-25 设置 Alpha 


Step 3 ”配合 Alt 键 用 鼠标 移动 复制 ， 最 后 效果 如 图 8-26 所 示 。 
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图 8-26 移动 复制 


Step 4 单 击 “中 层 雨 水 "图 层 , 将 与 之 相对 应 的 元 件 拖 到 场景 中 并 设置 Alpha 为 802， 
然后 配合 Alt 键 用 鼠标 移动 复制 (图 8 一 27) 。 


图 8-27 移动 复制 


Step 5 ”如 法 炮制 将 后 层 的 雨水 制作 完成 ， 设 置 Alpha 为 70%6， 并 配合 Alt 键 移动 复 
制 ， 最 后 效果 如 图 8 一 28 所 示 。 


图 8-28 雨水 效果 
按 下 Ctrl+Enter 组 合 键 进行 预览 ， 效果 还 不 错 吧 ? 现在 只 是 成 功 了 一 半 


， 如 果 配 上 声音 


GO | 划 雨中 的 城 
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将 会 更 加 完美 。 


Step 6 新建 一 个 图 层 并 命名 为 “声音 "。 选 择 File | Import (导入 ) 命令 ， 在 附 赠 的 
光盘 中 找到 素材 | Rain. WAYV 文件 ， 然 后 在 Properties 面板 中 设置 Loop (循环 次 数 ) 为 1000 
(图 8-29). 
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图 8-29 设置 Loop (循环 次 数 ) 


续 播 放 ， 则 应 该 将 Loops 设置 的 高 一 些 ， 否 则 声音 会 因为 循环 播放 


Timeline 


图 后 层 雨 水 Movie 
图 前 层 雨水 Movie 
图 线 Graph 
四 雨 Graph 
国 雨滴 Graph 


图 中 层 雨 水 


图 8-31 Library 结构 


当 所 有 的 制作 都 完成 后 ， 选 择 File | Export Moive 命令 输出 成 Swf 格式 的 影 


8.4 小 结 


当 完 成 这 个 动画 后 ,我 们 又 掌握 了 更 多 的 制作 方法 与 技巧 , 特别 是 学 会 了 如 何 通过 制作 
多 层次 的 动画 效果 来 丰富 画面 。Flash 是 二 维 绘图 、 动 画 制作 软件 ， 但 我 们 就 是 要 在 这 二 维 
世界 中 模拟 创造 出 多 层次 的 空间 效果 ， 只 有 这 样 产 生出 的 作品 才 会 令 人 心动 。 


到 此 一 游 一 一 文字 的 动态 输入 效果 


( 周 使 用 Flash MX 中 的 填充 工具 模拟 制作 具有 真实 光影 效果 的 立柱 
( 周 如 何在 绘制 好 的 图 形 上 制作 具有 四 凸 效果 的 动态 字体 

利用 Reverse Frames 实 现 影 帧 的 反 转 播放 

( 辕 使 用 编辑 多 帧 功能 一 次 变换 所 有 帧 的 色彩 


( 辕 通过 简单 的 技巧 制作 出 文字 输入 的 动态 效果 


这 个 动画 的 关键 技巧 在 于 先 将 文字 打 散 再 进行 反 向 擦 除 ,然后 对 部 分 影 帧 进行 反 转播 放 
从 而 以 达到 文字 输入 的 动态 效果 , 并 且 在 制作 过 程 中 利用 了 编辑 多 帧 功能 , 极 大 地 提高 了 工 
作 效 率 (图 9-1 和 图 9 一 2 ) 。 


图 9_1 成 唱 效果 之 一 
操作 步骤 
9.1 绘制 立柱 和 背景 墙 


Step 1 启动 Flash MX， 新 建 一 个 空白 文档 。 在 Properties 面板 中 设置 Size 为 400 x 
580Pixels， 其 他 参数 保持 默认 (图 9-3)。 


9-3 在 Properties 面板 中 设置 尺寸 


Step 2 ” 按 CtrlI+F8 组 合 键 创建 一 个 Symbol， 命 名 为 “ 墙 。 使 用 “工具 配合 Shift 键 
在 场景 中 绘制 出 墙 面 的 轮廓 ， 如 图 9-4 所 示 。 

Step 3 单 击 感 工具 ， 设 置 填充 色 的 R、G、B 为 225、203、115， 填 充 如 图 9-5 所 示 
的 部 分 。 
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图 9-4 绘制 墙 面 轮廓 图 9-5 填充 部 分 墙 面 


| Step 4 设置 R、G、B 为 245、236、167， 填充 如 图 9-6 所 示 的 部 分 ，R、G、B 为 225、 
| 225、186， 填 充 如 图 9-7 所 示 的 部 分 ， 至 此 背景 墙 的 绘制 已 经 完成 。 


图 9-6 填充 部 分 墙 面 图 9-7 填充 部 分 墙 面 


Step 5 ”创建 一 个 新 的 Symbol， 命名 为 “立柱 。 使 用 皇 工 具 在 场景 中 绘制 一 个 无 填 
充 色 的 矩形 ， 单 击 起 工具 对 矩形 进行 填充 ,设置 填充 方式 为 Linear (线性 填充 )， 将 两 个 过 
渡 色 的 R、G、8B 值 设 定 为 159、3、0， 高 光 色 的 R、G、B 值 设 定 为 243、45、0， 反 光 的 R. 
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G、B 值 设 定 为 102、102、204， 如 图 9-8 和 图 9-9 所 示 。 


图 9-8 设置 填充 色 图 9-9 填充 立柱 


Step 6 单 击 又 工具 对 填充 色 进 行 调整 (图 9-10)。 
Step 7 单 击 上 ES5 列 回 到 主场 景 ， 新 建 “ 立 柱 ” 、 背景 ”图 层 ， 然 后 将 Library 中 与 之 
相对 应 的 元 件 拖 入 其 中 ， 如 图 9-11 所 示 。 


图 9-10 调整 填充 色 图 9-11 新 建 图 层 并 将 相应 的 元 件 拖 入 


Step 8 单 击 “ 背 景 ”图 层 中 的 元 件 ， 在 Properties 面板 中 按 图 9-12 所 示 进 行 设置 。 
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图 9-12 在 Properties 面板 中 设置 参数 


一 层 有 色 玻 璃 。 人 在 


Step 9 适当 调整 一 下 图 形 的 位 置 ， 最 后 效果 如 图 9-13 所 示 。 


图 9-13 调整 图 形 的 位 置 


9.2 制作 文字 的 动态 输入 效果 


Step 1 按 快捷 键 F5 将 两 个 图 层 的 时 间 轴 延长 至 第 175 帧 ， 在 两 个 图 层 的 第 35 帧 处 
各 插入 一 个 关键 帧 并 使 用 玛 工具 将 图 形 进 行 一 定 的 等 比 放 大 ， 最 后 生成 Motion Tween 动画 
(图 9 一 14) 。 
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图 9-14 生成 Motion Tween 动画 


Step 2 ”新建 一 个 图 层 , 在 第 45 帧 处 插入 一 个 关键 帧 , 使 用 读 工 具 在 场景 中 输入 到 、 
字样 ， 然 后 按 Ctrl+B 组 合 键 将 其 打 散 (图 9-15)。 


图 9-15 打 散 图 形 
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用 图 工具 对 其 进行 擦 除 修改 等 


Step 3 在 第 46 帧 处 插入 一 个 关键 帧 ,使 用 2 工具 对 文字 进行 反 向 控 除 ， 如 图 9-16。 
Step 4 在 第 47 帧 处 插入 一 个 关键 帧 ， 继 续 进 行 反 向 擦 除 (图 98 一 17)。 


图 9-16 反 向 氛 除 图 9-17 反 向 擦 除 


Step 5 ”使 用 相同 的 方法 ， 每 插入 一 个 关键 帧 ， 都 使 用 乙 工具 对 其 进行 反 向 擦 除 ， 直 
至 完成 为 止 (图 9-18) 。 


图 9-18 反 向 控 除 


Step 6 配合 Shift 键 全 选 关键 帧 后 面 所 有 的 影 帧 ， 单 击 鼠 标 右键 ， 在 弹出 的 菜单 中 选 
择 Remove Frames (删除 影 帧 ) ， 如 图 9--19 所 示 。 


四 多 划 加 


6 6 加 1 上 5 9 和 5 100 105 ll0 15 120 125 130 1 


Step 7 配合 Shift 键 全 选 当前 层 的 关键 帧 ， 单 击 鼠 标 右键 并 选择 Reverse Frames ( 反 转 
影 帧 ) ,如 图 9-20 所 示 。 按 Enter 键 预览 Timeline， 就 会 看 到 一 笔 一 画 输入 文字 的 动态 效果 了 。 


图 9-20 反 转 影 帧 


9.3 制作 文字 的 凹凸 效 果 


Step 1 ”新建 一 个 图 层 ， 在 第 45 帧 处 插入 一 个 关键 帧 ， 然 后 将 它 拖 到 文字 ”图 层 
的 下 面 (图 9--21 ) 。 


vv Timeline 


图 9-21 新 建 图 层 


Step 2 配合 Shift 键 全 选 “文字 ”图 层 的 所 有 关键 帧 ， 单 击 鼠 标 右键 选 择 Copy Frames 
(复制 影 帧 ) ， 然 后 将 它 粘 贴 在 新 建 图 层 的 第 45 帧 处 (图 9 一 22) 。 


GO 医 e 到 此 一 游 


文字 的 动态 输入 效果 


Step 3 关闭 文字 图 层 的 显示 状态 , 全 选 新 建 图 层 的 所 有 关键 帧 , 然后 单 击 TimeLine 
面板 中 剧 多 帧 编辑 工具 并 将 范围 标记 拖 动 到 如 图 9-23 所 示 的 位 置 。 
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图 9-23 ”使 用 多 帧 编辑 工具 
Step 4 使 用 感 工具 进行 填充 ， 设 定 R、G、B 数值 为 51、51、51， 这 样 所 有 关键 帧 中 
的 文字 图 形 就 都 被 填充 为 深 灰 色 了 ， 如 图 9-24 所 示 。 
Step 5 ”继续 使 用 到 多 帧 编辑 工具 ， 将 所 有 关键 帧 中 的 文字 图 形 向 左上 角 略 微 移动 以 
模拟 凹凸 所 产生 的 投影 ， 关 闭 多 帧 编辑 工具 并 打开 文字 图 层 的 显示 状态 ， 最 后 效果 如 图 9 一 


25 所 示 。 


图 9-24 填充 文字 图 形 图 9-25 模拟 凹凸 所 产生 的 投影 


按 下 Ctrl+Enter 组 合 键 进行 预览 ， 就 能 看 到 具有 真实 凹凸 和 动态 效果 的 文字 输入 动画 了 。 
Step 6 利用 同样 的 方法 将 后 面 的 制作 完成 ， 最 后 效果 如 图 9-26 所 示 ，Timeline 面板 
如 图 9-27 所 示 。 


图 9-26 最 后 效果 
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图 9-27 Timeline 面板 
当 所 有 的 制作 都 完成 后 ， 别 忘 了 生成 .Swf 格式 的 文件 ， 看 一 看 自己 的 劳动 成 果 吧 。 
9.4 小 结 


回顾 本 章 ， 我 们 更 加 深入 地 学 习 了 Flash 中 的 绘图 功能 ， 了 解 了 制作 真实 效果 的 立柱 和 
改变 图 形 色 调 等 方法 , 当然 最 重要 的 是 掌握 了 反 转 影 帧 和 编辑 多 影 帧 技巧 的 实际 应 用 ,在 将 
来 制作 复杂 动画 时 ， 熟 练 地 应 用 这 些 技巧 可 以 大 幅度 提高 工作 效率 。 


会 一 一 交互 按钮 的 应 用 
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深入 了 解 Flash 中 Symbol 的 三 种 属性 : 图 像 、 按 钮 和 影片 片段 
如 何 通过 对 按钮 的 控制 使 影片 产生 人 机 交互 性 
了 解 Flash MX 中 按钮 的 四 种 状态 : Up、Over.、 Down 和 Hit 


如 何 通过 Actions 来 控制 影片 的 播放 与 停止 


当 有 人 拿 着 玫瑰 花 出 现在 你 的 面前 主动 请 你 约会 时 ,你 会 答应 吗 ; 这 是 一 个 非常 简单 的 
完整 人 物 小 动画 ， 它 主要 是 通过 交互 按钮 的 应 用 和 Actions 中 的 Stop 命令 来 控制 整个 影片 ， 
成 品 效果 如 图 10-1 一 图 10--3 所 示 。 
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图 10-1 成 品 效果 之 一 图 10-2 成品 效 果 之 二 
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图 10-3 成 品 效果 之 三 


10.1 绘制 所 需要 的 素材 
Step 1 启动 Flash MX， 新 建文 档 。 在 Properties 面板 中 设置 Size 为 650 Colors 


1 
x 400Pixels。 双击 Layer 1 改名 为 “背景 ”， 然 后 单 击 蝇 工 具 ， 取消 色彩 填充 :可 
(图 10-4) 并 绘制 一 个 和 场景 同样 大 小 的 矩形 轮廓 。 划 计 
图 10-4 了 到 
消 色彩 填充 


Step 2 单 击 古 工 具 ， 在 Color Mixer 面板 中 按 图 10-5 所 示 进 行 设置 ， 填 充 后 的 效果 
如 图 10-6 所 示 。 


) 图 10-5 Color Mixer 面板 图 10-6 填充 矩形 


Step 3” 按 Ctrl+F8 组 合 键 创 建 一 个 Symbol， 设 置 元 件 属性 为 Graphic。 使 用 如 工具 在 
场景 中 绘制 出 人 物 的 外 轮廓 ,由 于 是 搞笑 动画 ,所 以 尽 可 能 的 要 将 人 物 夺 张 ， 如 图 10-7 所 
示 。 如 果 想 得 到 更 加 圆滑 的 曲线 ， 可 以 使 用 国 工 具 对 线条 进行 深入 调整 。 

Step 4 选择 恩 工 具 ， 按 照 自己 喜欢 的 颜色 对 图 像 进行 填充 (图 10-8 。 


图 10-7 绘制 出 人 物 的 外 轮廓 图 10-8 对 图 像 进行 填充 
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Step 5 ”创建 一 个 新 的 Symbol 并 命名 为 “运动 ， 按 CtrlI+L 组 合 键 打 开 Library， 将 刚 
刚 绘制 的 人 物 图 形 拖 入 场景 中 ， 然 后 按 F6 键 在 第 4 帧 上 插入 一 个 关键 帧 (图 10-9 ) 。 


图 10-9 插入 关键 帧 


Step 6 将 第 4 帧 的 人 物 图 形 做 适当 的 修改 ， 如 图 10-10 所 示 。 


图 10-10 修改 人 物 图 形 
Step 7 新 建 一 个 图 层 ， 使 用 口 工具 绘制 一 个 椭圆 作为 阴影 ， 最 后 效果 如 图 10-11 所 
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图 10-11 绘制 阴影 


Step 8 按 CtrlI+F8 组 合 键 新 建 一 个 Symbol， 用 同样 的 方法 制作 一 个 奔跑 的 小 狗 (图 
10-12) ，Timleline 如 图 10-13 所 示 。 


图 10-12 ”绘制 小 狗 图 形 
10.2 制作 主场 景 
Step 1 按 有 9 靖 器 到 主场 景 ， 新 建 一 个 “投影 ”图 


层 , 然后 将 Library 中 的 人 物 图 形 拖 入 当前 层 中 (图 10-14) 。 


图 10-14 将 人 物 图 形 拖 入 场景 中 


Step 2 选择 Modify | Transform | Flip Horizontal 命令 将 图 形 水 平 镜 像 ， 在 Properties 
面板 中 按 图 10-15 所 示 进 行 设置 ， 然 后 使 用 二 工具 将 图 形 移动 到 如 图 10-16 所 示 的 位 置 。 
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图 10-15 在 Properties 面板 中 设置 参数 图 10-16 图 形 位 置 


8 作 二 二 约会 一 一 交互 按钮 的 应 用 


Step 3 按 F6 键 在 第 45 帧 处 插入 一 个 关键 帧 ， 使 用 豆 工 具 配合 Shift 键 将 人 物 图 形 等 
比 放大 ,然后 在 Properties 面 板 中 按 图 10-17 所 示 进 行 设 置 并 生成 Motion Tween 动 画 (图 10-- 
18) 。 
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图 10-17 在 Properties 面板 中 设置 动画 10-18 生成 Motion Tween 动画 


Step 4 按 F5 键 将 所 有 图 层 的 时 间 轴 延长 至 125 帧 ， 新 建 一 个 图 层 并 在 第 50、 第 70 
和 第 90 帧 处 分 别 插入 关键 帧 (图 10-19 ) 。 


10-19 插入 关键 帧 


Step 5 ”使 用 站 工具 在 新 建 的 3 个 关键 帧 中 随意 输入 一 些 文字 ， 如 图 10--20 所 示 。 


图 10-20 输入 文字 


四 多 敬 国 


10.3 ”交互 按钮 的 制作 过 程 


Step 1 按 CtrlI+F8 组 合 键 新 建 一 个 Symbol 并 命名 为 “玫瑰 ， 设 置 其 属性 为 Graphic 
(图 形 )， 使 用 有 工具 在 场景 中 绘制 一 个 玫瑰 (图 10-21) 。 
Step 2 ”继续 新 建 一 个 Symbol， 按 图 10-22 所 示 进 行 设置 。 
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[evevsrmbo 
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图 10-21 绘制 玫瑰 图 10-22 新 建 Symbol 


图 10-23 编辑 Up 影 帧 
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| 六 吉 扩 杀 的 应 用 


Step 4 按 F6 键 在 Over 影 帧 上 插入 一 个 关键 帧 ， 使 用 锭 工具 将 图 形 进行 一 定 的 放大 
和 旋转 (图 10-24)。 


这 样 做 可 以 使 鼠标 经 过 按钮 时 所 产生 的 交互 性 更 加 明显 


ssSHNSOESAN 
SS DADm>n 


10-24 编辑 Over 影 帧 


Step 5 ”在 Down 影 帧 上 插入 关键 帧 ， 使 用 表 工 具 将 图 形 适 当 缩小 ， 这 主要 是 鼠标 单 
击 按钮 的 状态 ， 如 图 10-25 所 示 。 


图 10-25 编辑 Down 影 帧 


Step 6 按 F6 键 在 Hit 影 帧 上 插入 关键 帧 并 将 玫瑰 图 形 删 除 ， 单 击 Timline 中 的 刘洋 葱 
皮 按钮 ,使 用 吾 工 具 绘 制 一 个 能 够 完全 覆盖 玫瑰 图 形 的 矩形 作为 鼠标 反应 范围 , 不 必 考 虑 其 


颜色 ， 最 后 关闭 洋葱 皮 按钮 (图 10-26) 。 


图 10-26 绘制 鼠标 反应 范围 


10.4 通过 交互 按钮 控制 影片 


Step 1 。 按 攻 BE 但 回 到 主场 景 ， 在 “投影 ”图 层 的 第 100 帧 处 插入 一 个 关键 帧 并 绘 
制 出 手臂 图 形 ， 如 图 10-27 所 示 。 


图 10-27 绘制 手臂 


Step 2 ”新 建 一 个 图 层 并 命名 为 “玫瑰 ， 按 F6 键 在 第 100 帧 上 插入 关键 帧 并 将 Library 
中 的 玫瑰 图 形 拖 入 其 中 ， 按 图 10-28 和 图 10-29 所 示 创 建 一 段 20 帧 的 Motion Tween 动画 。 
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10-28 Motion Tween 动画 


Step 3 在 当前 层 的 第 121 帧 插入 一 个 
关键 帧 ， 将 玫瑰 图 形 删 除 。 然 后 拖 动 Library 
中 的 玫瑰 按钮 至 场景 中 ， 按 下 人 按钮 , 对 照 
前 一 帧 将 按钮 移动 到 同样 的 位 置 ， 如 图 10 一 
30 所 示 。 


图 10-30 移动 按钮 


Step 4 ”新建 一 个 图 层 并 命名 为 "Action ， La 
。 中 Actions for Frame 121 of Layer Name action 
在 121 帧 上 插入 一 个 关键 帧 ， 然 后 在 Actions - 


面板 中 双击 stop 命令 ， 如 图 10-31 所 示 。 


财 Movie Clip Control 


图 10-31 在 Actions 面板 中 双击 “Stop” 命令 


按 下 Ctrl+Enter 组 合 键 进行 预览 , 当 影 片 
播放 到 第 121 帧 处 就 会 停止 ， 这 时 按钮 也 将 
起 作用 ， 可 以 用 鼠标 单 击 按钮 进行 测试 。 

Step 5 ”继续 新 建 图 层 ， 并 命名 为 “人 
物 ”, 在 第 125 帧 处 插入 一 个 关键 帧 , 将 Library 
中 的 “人 物 运动 ” 与 “小 狗 ” 元 件 拖 入 场景 
中 。 在 “背景 ”图 层 的 第 125 帧 处 同样 插入 
关键 帧 ， 并 随意 绘制 一 个 新 的 背景 ， 最 后 按 
F5 键 延 长 两 个 图 层 的 时 间 轴 到 第 180 帧 (图 
TO 一 S2)。 


Step 6 单 击 第 121 帧 中 的 玫瑰 按钮 ， 
在 Action 面板 中 双击 on 命令 ， 确 定 匀 选 
release, 双击 goto 命 令 并 在 Frame 后面 的 对 话 
框 中 输入 125， 如 图 10-33 所 示 。 


| 


图 10-32 绘制 一 个 新 的 背景 


[所 Actors for [No mstance name arzigned] ( 必 员 技 伍 ) 
司 


所 有 的 制作 都 完成 了 ， 按 下 Ctrl+Enter 组 合 键 进行 预览 并 测试 按钮 的 交互 性 ,如 确定 没 
有 问题 后 选择 File | Export Movie 命令 输出 成 .Swf 格式 文件 。 


10.5 “小 结 


当 所 有 的 制作 完成 后 , 我 们 已 经 了 解 并 学 习 了 如 何 通过 简单 的 Actions 来 控制 影片 的 播 
放 以 及 Symbol 三 种 属性 中 的 最 后 一 种 : 按钮 元 件 的 制作 与 应 用 。 在 制作 超 酷 Flash 主页 、 交 
互 性 界面 和 复杂 动画 时 ， 按 钮 与 Actions 应 用 的 熟练 程度 将 直接 影响 到 作品 的 成 败 。 


第 章 EETES] 


学 习 Mask ( 遮 章 ) 的 高 级 应 用 技巧 
( 千 利用 Actions 里 面 的 Start Drag 命令 实现 托 搜 效果 


( 千 如 何 让 浏览 者 通过 鼠标 与 动画 影片 产生 交互 反应 


这 个 范例 属于 可 托 搜 的 遮 章 效果 ,影片 中 的 瞄准 镜 会 随 着 浏览 者 的 鼠标 而 移动 ,因此 产 
生 交 互 反应 ， 成 品 效果 如 图 11-1 和 图 11-2 所 示 。 


图 11-1 成 品 效 果 之 一 图 11-2 成 品 效果 之 二 


11.1 制作 瞄准 镜 遮 罩 


Step 1 启动 Flash MX 软件 ， 建 立 一 个 新 的 文件 ， 设 置 Size 为 540 x 360Pixels ”其 
他 设置 保持 默认 (图 11-3)。 
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图 11-3 在 Properties 面板 中 设置 参数 


Step 2 ”双击 Layer 1 图 层 ， 将 它 改名 为 “背景 图 片 。 选 择 File | Import (导入 ) 命 


令 , 在 附 赠 的 光盘 中 找到 素材 | cs.jpg 文 件 , 将 此 图 导入 背景 图 层 中 并 使 用 尽 工 具 将 它 调整 
到 合适 大 小 ， 如 图 11-4 所 示 。 


图 11-4 导入 图 片 并 调整 大 小 


Step 3 新建 一 个 图 层 命名 为 “ 遮 罩 ， 单 击 工具 ， 配 合 Shift 键 在 场景 中 绘制 一 个 
圆 形 ， 颜 色 不 拘 (图 11-5)。 


图 11-5 绘制 一 个 圆 形 


Step 4 单 击 “ 工 具 , 在 Properties 面板 中 将 线条 的 粗细 设置 为 5 (图 11-6), 按 图 11-- 
7 所 示 绘 制 出 瞄准 镜 的 形状 。 
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图 11-6 Properties 面板 
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图 11-7 绘制 出 瞄准 镜 


Step 5 按 Del 键 将 线条 删除 


信 


， 形 成 图 11-8 所 示 的 图 形 效 果 。 


PE 


图 11-8 删除 线条 


Step 6 选择 该 图 形 ， 按 F8 键 将 它 转 为 一 个 Symbol， 按 图 11--9 所 示 进 行 设 置 ， 然 后 
在 Properties 面板 中 将 其 名 称 定义 为 “cs ， 如 图 11-10 所 示 。 
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11-9 转 为 Symbol 
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图 11-10 定义 名 称 


11.2 ”生成 遮 四 效果 


Step 1 单 击 瞄准 镜 图 形 ， 在 Actions 面板 中 双击 startDrag 命令 ， 在 Target 后 面 的 对 话 
框 中 输入 cs 并 勾 选 Expression 和 Lock mouse to center (图 11-11 ) 。 


图 11-11 在 Actions 面板 中 设置 参数 


Step 2 ”用 鼠标 右键 单 击 “ 遮 章 ” 图 层 ， 在 弹出 的 菜单 中 选择 Mask ( 遮 单 命令 ) ， 如 
图 11-12 所 示 。 


Timeline 


和 宣 ||4| 刘 叶 对 加 | 
图 11-12 应 用 Mask 


按 下 Ctrl+Enter 组 合 键 进 行 预览 ， 遮 章 被 成 功 拖 搜 后 的 效果 如 图 11-13 所 示 。 


图 11-13 遮 踢 被 成 功 拖 搜 


88 


11.3 ”小结 

通过 本 章 实例 我 们 更 进一步 的 学 习 了 Mask ( 遮 单 ) 的 运用 技巧 ， 以 及 如 何 通 过 设置 
Actions 使 浏览 者 与 动画 影片 产生 交互 反应 。 这 个 简单 的 技巧 在 Flash 网 站 、 复 杂 动 画 、 产品 
展示 以 及 商业 广告 等 制作 中 使 用 频率 相当 高 ， 如 果 能 熟练 的 运用 ， 将 会 使 你 的 作品 在 众多 
Flash 动画 中 脱颖而出 。 


必 


区 而 内功 一 -Flash MX 异 珠 此 吗 怠 站 


@SnMX 
Fash MX 网 络 广告 


| 剧 了 解 制作 商业 网 络 广告 的 基本 流程 
利用 简单 的 动画 技巧 体现 品牌 的 形象 化 
| 便 部 练 掌握 网 络 广告 的 制作 技巧 与 方法 


| 全 如 何 使 用 Edit In Place 技巧 提高 动画 制作 效率 


这 是 一 个 网 络 广告 实例 的 制作 流程 , 它 利 用 了 和 遮 罩 技 巧 模拟 出 逐渐 扩充 的 文字 效果 , 如 
图 12 一 1 和 图 12--2 所 示 。 


图 12-1 成 品 效果 之 一 图 12-2 成 品 效果 之 二 


12.1 制作 网 络 广告 基本 元 素 


Step 1 启动 Flash MX， 新 建文 档 。 在 Properties 面板 中 设置 Size 为 500 x 100Pixels 
Background 背景 色 设 定 为 共 FFD528 (图 12--3) 。 


辐 二 过 Sbr Wapine | Bydtgyouma 站 Fwpae [Hpx 
en 


图 12-3 在 Properties 面板 设置 参数 
Step 2 单 击 口 工具 ， 设置 Stroke color 为 共 8C8553，Fill color 为 共 FFE21B (图 12 一 
4)， 然 后 在 场景 两 侧 绘制 出 如 图 12--5 所 示 的 矩形 。 


四 四 鸭 国 
h MX 经 典 作 


图 12-4 Color Mixer 面板 图 12-5 绘制 矩形 
Step 3 ”使 用 员工 具 在 场景 中 绘制 两 条 白色 线段 ， 如 图 12--6 所 示 。 


图 12-6 绘制 线段 
Step 4 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 并 命名 为 “背景 动画 。 单 击 态 工具， 设 
置 填充 色 为 夫 FFFF00 并 将 Alpha 调整 为 3096 (图 12-7)， 在 场景 中 输入 “Flash MX ”字样 
(图 亿 =8)。 


图 12-7 调整 Alpha 图 12-8 输入 文字 


Step 5 按 F6 键 在 当前 层 第 80 帧 上 插入 一 个 关键 帧 并 生成 Motion Tween 动画 ， 配 合 
Shift 键 将 第 80 帧 中 的 文字 图 形 向 左 移动 ， 如 图 12--9 所 示 。 


AI 站 ET IE 人 
12-9 生成 Motion Tween 动画 


12.2 制作 遮 罩 动画 效果 


Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol 并 命名 为 “ 遮 章 动画 *， 使 用 丽 工 具 在 场景 
中 输入 “Flash MX 动画 大 风暴 ”字样 (图 12-10). 


图 12-10 输入 文字 


Flash MX 网 络 广告 | 


Step 2 新建 一 个 图 层 ， 使 用 / 工具 在 场景 中 绘制 出 如 图 12 一 11 所 示 的 图 形 。 


图 12-11 绘制 图 形 


Step 3 选择 A 工具， 如 图 12-12 所 示 将 直线 调整 为 曲线 并 使 用 & 工具 对 图 形 进行 填 
充 ， 最 后 效果 如 图 12-13 所 示 。 


图 12-12 调整 为 曲线 图 12-13 对 图 形 进 行 填充 


Step 4 在 当前 层 第 80 帧 处 插入 一 个 关键 帧 ， 分 别 将 第 1 和 第 80 帧 中 的 图 形 移 动 至 
图 12--14 和 图 12--15 所 示 的 位 置 ， 最 后 生成 Motion Tween 动画 。 


图 12-14 第 1 帧 中 图 形 的 位 置 图 12-15 第 80 帧 中 图 形 的 位 置 


Step 5 按 F5 键 将 两 个 图 层 的 时 间 轴 延长 至 120 帧 处 ， 如 图 12 一 16 所 示 。 


Timeene 


Ai P 观 了 
在 弹出 的 菜单 中 选择 Mask 选项 (图 12 一 CTRL 


17) , 这 样 就 形成 了 文字 从 中 间 扩 散 到 两 
端的 效果 了 。 


图 12-17 选择 Mask 


12.3 合成 影片 


Step 1 
12 一 18 ) 。 


EPE 加 到 主场 景 ， 将 Library 中 的 “背景 动画 ”元 件 拖 入 Layer 1 中 (图 


本 
if 


12-18 返回 主场 景 


Step 2 ”用 鼠标 右键 单 击 该 元 件 ， 在 弹出 的 菜单 中 选择 Edit In Place ( 原 地 编辑 ) 命 
令 ， 分 别 将 第 1 和 第 80 帧 的 文字 图 形 移动 至 如 图 12-19 和 图 12-20 所 示 的 位 置 。 


] 上 
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至 中 大 天 


图 12-19 第 1 帧 文字 图 形 的 位 置 12-20 第 80 帧 文字 图 形 的 位 置 


Step 3 ” 当 编辑 修改 完成 后 ， 按 有 
章 动画 ”元 件 拖 入 其 中 ， 按 下 Ctrl+Enter 组 合 键 进行 预览 ， 最 后 效果 如 图 12-21 所 示 。 


12-21 最 后 效果 


12.4 小 结 


本 章 主要 介绍 了 一 个 较为 简单 的 Flash 广告 的 制作 流程 。 网 络 广告 是 近 几 年 新 兴 的 媒体 
广告 形式 ， 它 具有 表现 力 强 ,投放 迅速 、 成 本 较 低 等 优势 。 尽 管 网 络 广告 的 制作 相对 简单 ， 
但 也 要 注意 以 下 几 个 问题 ，Flash 广 告 的 制作 目的 是 力求 在 极 短 的 时 间 内 抓 住 浏览 者 的 视线 ， 
要 为 宣传 产品 本 身 服 务 , 而 不 能 盲目 追求 视觉 效果 而 忽视 主体 内 容 , 其 次 还 要 注意 广告 的 时 
间 及 文件 大 小 等 。 

网 络 广告 通常 有 固定 的 尺寸 ,真正 制作 时 要 注意 

Banner ，468 x 60Pixels 

流 媒 体 ， 160 x 160Pixels 

柱 形 广 告 : 120 x 320Pixels 

Button: 100 x 50Pixels 

画 中 国 : 360 x 300Pixels 
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本 章 重 点 


使 用 各 种 动画 技巧 模拟 真实 的 需 虹 灯 效 果 
通过 多 层 逐 帧 动画 创造 出 丰富 的 动态 画面 
合理 利用 Reverse Frames 模 拟 各 种 动画 效果 


进一步 了 解 制作 Flash 短片 的 基本 思路 、 实 现 方法 以 及 操作 步骤 


预览 成 品 


本 章 运用 了 多 种 动画 制作 技巧 非常 真实 地 模拟 出 夜幕 下 的 需 虹 灯 效 果 , 如 图 13-1 和 图 
13 一 2 所 示 。 
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图 13-1 成 品 效果 之 一 图 13=2 成 品 效果 之 二 
操作 步骤 


13.1 制作 背景 动画 


Step 1 启动 Flash MX , 新 建 一 个 文档 。 在 Properties 面 板 中 设置 Size 为 290 x 400Pixels 
Background 背景 色 设 定 为 并 3A1D58 (图 13-3) 
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图 13-3 在 Properties 面板 中 设置 参数 


Step 2 双击 Layer 1 将 其 改名 为 “背景 "。 单 击 ” 工具 , 设置 Stroke color 为 共 FF9900 
然后 在 场景 中 绘制 出 如 图 13-4 所 示 的 建筑 物 轮 廊 。 

Step 3 单 击 & 工具 ， 设置 Fill color 为 共 FF9900 并 对 图 形 进行 填充 ， 最 后 形成 的 逆 
光 效果 如 图 13-5 所 示 。 


图 13-4 绘制 建筑 物 轮廓 图 13-5 递 光 效果 


Step 4 新建 一 个 图 层 并 命名 为 “ 灯 ， 在 第 5 帧 处 插入 一 个 关键 帧 ， 使 用 口 工 具 在 
场景 中 绘制 一 个 矩形 并 将 其 大 量 复制 ， 以 便于 营造 出 光亮 效果 (图 13-6) 

Step 5 在 第 6 帧 处 插入 一 个 关键 帧 ， 按 Del 键 删除 一 些 憩 形 ， 如 图 13-7 所 示 

Step 6 在 第 7 帧 处 插入 关键 帧 并 继续 删除 矩形 (图 13-8) 。 


图 13-6 绘制 矩形 并 大 量 复制 图 13-7 删除 一 些 和 矩形 图 13-8 继续 删除 矩形 


Step 7 ”使 用 相同 的 方法 , 每 插入 一 个 关键 帧 都 删除 一 些 矩 形 , 直至 全 部 删除 为 止 (图 
13-9) ，Timeline 如 图 13--10 所 示 。 


了 次 的 喜 红 放 


Timeline 


灯 ，， 口 | Oooeeeeeleeleeleeeeleleeleleeeleleleleele 


图 13-9 将 矩形 全 部 删除 图 13-10 Timeline 结构 
Step 8 在 当前 层 中 ,配合 Shift 键 选择 所 有 关键 帧 , 单 击 鼠 标 右键 并 选择 Reverse Frames 
( 反 转 影 帧 ) ， 如 图 43-11 所 示 。 按 Ctrl+Enter 组 合 键 进行 预览 ， 就 会 看 到 城市 的 灯光 渐渐 开 
启 的 动画 效果 了 (图 13-12)。 


图 13-11 选择 Reverse Frames 图 13-12 预览 效果 
13.2” 需 虹 灯 效 果 的 制作 方法 
Step 1 按 Ctrl+F8 组 合 键 创建 一 个 Symbol， 按 图 13-13 所 示 进 行 设置 。 


图 13-13 创建 Symbol 
Step 2 “ 单 击 遇 工 具 ， 设 置 线条 形式 为 Step 5， 粗 细 程 度 为 4， 填 充 色 为 共 QOFF00 
然后 绘制 出 如 图 13-14 所 示 的 图 形 。 
Step 3 在 第 6 帧 处 插入 一 个 关键 帧 并 改变 图 形 的 填充 色 ， 如 图 13-15 所 示 ， 


图 13-14 绘制 图 形 图 13-15 改变 图 形 的 填充 色 


四 罗 井 国 
@@Sh_ MX 经 


典 作 


Step 4 使 用 同样 的 方法 在 第 11、 第 16、 第 21 和 第 26 等 帧 上 分 别 插入 关键 帧 并 随意 
改变 其 填充 色 (图 13-16) 

Step 5 “新 建 一 个 图 层 并 命名 为 “Beautiful” 使 用 A 工 具 在 场景 中 输入 “Beautiful” 字 
样 (图 13-17) 


Beautiful 


图 13-16 插入 关键 帧 并 改变 填充 色 图 13-17 输入 文字 
Step 6 在 第 4 帧 上 插入 关键 帧 并 改变 文字 的 颜色 (图 13-18) 


图 13-18 改变 文字 颜色 图 13-19 插入 关键 帧 并 改变 填充 色 
Step 7 ”使 用 同样 的 方法 在 第 8、 第 12、 第 17 和 第 22 等 帧 上 分 别 插入 关键 帧 并 改变 
其 填充 色 (图 13--19)。 
Step 8 ”新建 一 个 图 层 ， 使 用 瑟 工 具 在 图 13--20 所 示 的 位 置 上 绘制 一 个 矩形 作为 庶 
罩 ， 然 后 将 该 图 层 拖 至 Layer 1 图 层 之 下 。 


图 13-20 绘制 遮 置 


Step 9 新建 一 个 图 层 并 命名 为 “灯光 ， 将 它 拖 至 最 底层 ， 然 后 使 用 口 工具 在 场景 
中 绘制 一 个 矩形 并 将 其 大 量 复 制 ， 最 后 效果 如 图 13-21 所 示 


图 13-21 大 量 复制 


单 击 “灯光 图 层 ， 按 Ctrl+K 组 合 键 打开 Align 面板 ， 按 图 13 一 22 所 示 进 
行 设置 ， 最 后 效果 如 图 13 一 23 所 示 。 全 


图 13-22 Align 面板 图 13-23 对齐 后 的 效果 
适当 的 改变 一 下 图 形 的 填充 色 并 按 F8 键 将 它 转 为 一 个 Symbol (图 13 一 24) 


图 13-24 改变 填充 色 


将 第 1 帧 的 图 形 移动 至 图 13-25 所 示 的 位 置 , 在 第 40 帧 上 插入 一 个 关键 帧 ， 
向 右 拖 动 图 形 至 图 13-26 所 示 的 位 置 ， 最 后 生成 Motion Tween 动画 


办 四 贡 国 
h MX 经 典 作 品 解 析 | 转 


Beautiful 


图 13-25 第 1 帧 图 形 的 位 置 图 13-26 第 40 帧 图 形 的 位 置 


Step 13 下面 我 们 将 通过 Mask 技巧 来 实现 霓虹灯 效果 ， 用 鼠标 右键 单 击 “ 遮 症 - 
层 ， 在 弹出 的 菜单 中 选择 Mask 选项 ， 结 果 如 图 13-27 所 示 。 


图 13-27 设置 Mask 


Step 14 。 按 有 BE 5 王 按钮 回 到 主场 景 ， 新 建 一 个 图 层 ， 将 “ 需 虹 灯 ” 元 件 放 入 其 中 
(图 13-28)， 然 后 按 F5 键 将 所 有 图 层 的 时 间 轴 延长 至 50 帧 处 。 


Bealutiful 


图 13-28 最 后 效果 
按 下 Ctrl+Enter 组 合 键 进行 预览 , 效果 相当 不 错 吧 7 如 果 一 切 都 满意 后 , 按 Shift+F12 组 
合 键 进行 影片 的 输出 。 
13.3 小 结 


通过 本 章 的 学 习 , 我 们 进一步 掌握 了 各 种 动画 的 制作 技巧 ,以 及 如 条 利 用 Mask .Reverse 
Frames 和 逐 帧 动画 等 方法 制作 出 丰富 多 彩 的 视觉 效果 。 反 复 观 察 优秀 的 Flash 动画 短片 ， 不 
难 发 现 其 中 很 多 精彩 的 动画 效果 都 是 由 非常 简单 的 技巧 发 展 运用 而 来 的 ,所 以 我 认为 不 光 要 
学 好 应 该 具备 的 软件 操作 技术 , 更 要 充分 的 发 挥 想像 力 、 创造 力 , 只 有 这 样 优秀 的 作品 才 有 
可 能 在 你 手中 诞生 。 
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利用 Flash MX 中 各 种 绘图 工具 绘制 卡通 形象 与 主体 场景 
快速 表现 玻璃 质感 的 技巧 与 方法 
如 何 将 优秀 的 创意 融入 Flash 公 益 广 告 之 中 


制作 网 络 公益 广告 的 基本 流程 


本 章 是 一 则 网 络 公益 广告 的 制作 流程 ,优秀 的 创意 使 它 在 极 短 的 时 间 内 揭示 了 社会 公益 
问题 ， 引 发 了 浏览 者 的 关注 成 品 效果 如 图 14-1、 图 14--2 和 图 14--3 所 示 。 


， 


图 14-1 成 品 效果 之 一 图 14-2 成 品 效果 之 二 图 14-3 成 品 效果 之 三 


14.1 制作 动画 场景 所 需要 的 素材 
Step 1 首先 启动 Flash MX , 新 建文 档 . 在 Properties 面 板 中 设置 Size 为 380 x 500Piaxels ， 
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四 四 巴 国 
h MX 经 典 作 品 


其 他 设置 保持 默认 (图 14--4) 。 
Properties 


上 Dooument Se 3804500phels | 。 Background | FrameRate 2 fps 
第 十 三 和 覃 ?_ Publish。 ”Flash Player6 | 


14-4 在 Properties 面板 中 设置 参数 


Step 2 按 Ctrl+F8 键 新 建 一 个 Symbol， 命 名 为 “沙漏 。 单 击 o 工具 ， 设 置 线条 粗细 
程度 为 5 (图 14-5)， 然 后 在 场景 中 绘制 一 个 椭圆 ， 如 图 14-6 所 示 。 


Tool E 四 | 


图 14-5 设置 线条 粗细 程度 图 14-6 绘制 椭圆 


Step 3 ”继续 绘制 第 二 个 椭圆 ， 位 置 如 图 14- 7 所 示 。 使 用 去 工具 将 图 形 绘制 完成 (图 
14 一 8 ) 。 


图 14-7 绘制 权 贺 图 14-8 继续 绘制 
Step 4 按 CtrlI+A 组 合 键 全 选 图 形 , 使 


用 工具 配合 Alt 键 将 其 向 下 移动 复制 , 位 置 
如 图 14-9 所 示 。 


图 14-9 下 移动 复制 


站 ET 


Step 5 使用” 工具 在 中 间 绘 制 4 条 直线 (图 14-10)， 并 使 用 # 工具 将 直线 调整 为 图 
14--11 所 示 的 曲线 。 


图 14-10 绘制 直线 图 14-11 调整 为 曲线 


Step 6 单 击 二 工具 ， 设置 Fill Color 为 共 B3B3B3， 然 后 填充 沙漏 两 端的 瓶 口 ， 如 图 
14--12 所 示 。 


图 14-12 填充 沙漏 两 端的 撼 口 


Step 7 ”继续 使 用 古 工 具 ， 设置 Fill Color 为 #E9F3FE 并 填充 沙漏 的 瓶 体 (图 14-13) 。 

Step 8 使 用 加 工具 绘制 出 如 图 14--14 所 示 的 曲线 ， 然 后 单 击 赤 工具， 设置 Fill Color 
为 #DFE0B8 填充 图 14--15 所 示 的 部 分 ，Fill Color 为 共 B7AB7D 填充 图 14-16 所 示 的 部 分 ， 
Fill Color 为 #C7DFA8 填充 图 14-17 所 示 的 部 分 。 


图 14-13 填充 沙漏 的 瓶 体 图 14-14 填充 沙漏 的 瓶 体 


图 14-15 填充 图 形 图 14-16 填充 图 形 图 14-17 填充 图 形 
Step 9 ”继续 绘制 沙漏 图 形 直至 完成 ， 如 图 14-18 所 示 。 


图 14-18 绘制 沙漏 图 形 


Step 10 ” 按 Ctrl+F8 组 合 键 创 建 一 个 Symbol， 并 命名 为 “Tree 。 使 用 ?工具 在 场景 
中 绘制 出 树 的 外 轮廓 (图 14--19)。 

Step 11 ”使 用 工 具 对 图 形 进 行 填充 并 按 Del 键 将 外 轮廓 删除 ， 最 后 效果 如 图 14-20 
所 示 。 


图 14-19 绘制 轮廓 图 14-20 删除 外 轮廓 
14.2 ”制作 动态 卡通 人 物 造 型 


Step 1 新 建 一 个 Symbol， 并 命名 为 “身体  。 使 用 丈 工 具 在 场景 中 绘制 如 图 14 一 21 
所 示 的 人 物 轮 廓 。 
Step 2 单 击 感 工具 ， 使 用 自己 喜欢 的 颜色 对 人 物 进 行 填充 (图 14-22)。 


t 


图 14-21 绘制 人 物 轮廓 图 14-22 填充 色彩 
Step 3 ”使 用 因 工 具 画 出 人 物 的 明暗 交界 线 ， 并 使 用 震 工 具 调整 曲 线 的 圆滑 度 (图 
14 一 23 ) 。 


Step 4 使 用 圈 工 具 对 人 物 的 背光 面 进行 填充 ， 最 后 效果 如 图 14-24 所 示 . 


t 


图 14-23 调整 曲线 图 14-24 填充 背光 面 


ee 
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Step 5 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol, 使 用 同样 的 方法 绘制 一 把 钢 锯 (图 14-25)， 


图 14-25 绘制 钢 锯 


轩 乓 的 国 
h MX 经 典 作 


14-26 新 建 Symbol 


Step 7 “利用 绘制 好 的 Symbol 组 合成 一 段 简 单 循环 的 动画 效果 ， 如 图 14-27 和 图 14 一 
28 所 示 。Timeline 和 关键 帧 位 置 如 图 14 一 29 所 示 。 


图 14-29 Timeline 和 关键 帧 位 置 


14.3 ”合成 影片 


Step 1 按 CtrI+F8 组 合 键 新 建 一 个 Symbol， 并 命名 为 “沙漏 动画 “， 将 所 有 的 元 素 进 
行 整合 ， 如 图 14--30 所 示 。 
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图 14-30 整合 动画 


和 玫 器 到 主场 景 ， 双 击 Layer 1 改名 为 “沙漏 "， 然 后 将 Library 中 的 
沙漏 动画 ”元 件 拖 入 场景 中 并 生成 一 段 长 度 为 150 帧 、 图 形 由 大 逐渐 缩小 的 Motion Tween 
动画 ， 如 图 14--31 所 示 。 


Timeline 


宣 吕 | 归 | 梧 | 165 [120fs | 137s 全 


14-31 生成 Motion Tween 动画 


Step 3 ”新 建 一 个 图 层 并 命名 为 “屏幕 "， 使 用 口 工具 在 场景 的 左右 两 端 绘制 一 组 幕 
布 (图 14 一 32) 。 


图 14-32 绘制 幕布 


Step 4 ”继续 新 建 一 个 图 层 ， 在 第 165 帧 上 插入 一 个 关键 帧 ， 使 用 工 具 在 场景 


一 个 惊叹 号 图 形 ， 


然后 按 F8 键 将 其 转 为 Symbol ， 


如 图 14--33 所 示 。 


overtmsmio 


mc:F 引 La | 
Cancel | 


Behavior: 食 Wovie Clip Registrati 器 


全 Button 


人 Aavanced | Jelp | 


Step 5 在 当前 层 的 第 180 帧 上 插入 一 个 关键 帧 并 生成 Motion Tween 动画 
在 Properties 面板 中 设置 其 Alpha 为 096 (图 14--34) 


165 帧 中 的 惊叹 号 图 形 ， 


和 Properties 


14-33 转 为 Symbol 


让 
周 
病 


图 14-34 设置 Alpha 


Step 6 单 击 “沙漏 "图 层 , 在 第 165 和 第 180 帧 上 分 别 插入 关键 帧 并 生成 Motion Tween 


动画 
所 示 。 


wm Properties 


然后 设置 第 180 帧 中 沙漏 图 形 的 Alpha 为 0% (图 14 一 35 ) 


Timeline 结构 如 图 14-36 


图 14-35 设置 Alpha 


避 可 双 辐 [Fi Ti26 Ts 可 


Step 7 ”新建 一 个 图 层 并 命名 为 “声音 
盘 中 找到 素材 | 声音 一 


(图 14 一 37)。 
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图 14-36 Timeline 结构 
， 选 择 FilellImport (导入 ) 命令 ， 在 附 赠 的 光 
2.WAV 文件 ， 然 后 在 Properties 面板 中 设置 Loop (循环 次 数 ) 为 1000 


ww Properties 


Sound: [ 声 者 -: 加 | 
Effect: [cusen =] _E 此 .| 


Sync: Ewent | Loop:|1000 times 


Tween: | None 下 | 


国 Frame 
5 FFrame Label: 


加 | 5rmed 声 ncHor 


22kHz viono8Bir43s595.4k 忆 


图 14-37 设置 Loop ( 循环 次 数 ) 


Step 8 完成 后 的 Timeline 结构 和 [Library 结构 如 图 14--38 和 图 14--39 所 示 。 


加 补漏 动画 
圆 身体 


图 14-39 Library 结构 


按 Ctrl+Enter 组 合 键 进行 预览 ， 如 果 满 意 的 话 ， 选 择 File|Export Moive 命令 输出 成 .Swf 
格式 的 影 


14.4 小 结 


当 完成 这 则 网 络 公益 广告 后 ,我 们 已 经 熟练 掌握 了 Flash 的 各 种 绘图 方法 与 技巧 ,制作 
一 般 的 动画 应 该 不 成 问题 了 .。 特别 需要 注意 的 是 , 当 准备 制作 动态 复杂 . 动作 幅度 大 的 人 物 
动画 时 ， 一 定 要 先 将 人 物 划分 成 多 个 元 素 ， 再 组 合 起 来 制作 动画 。 
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四 多 井 国 


新 款 跑 车 上 市 


一 网 上 产品 广告 设计 


本 章 重点 


学 习 和 掌握 网 上 产品 广告 设计 的 核心 元 素 、 制 作 方法 和 技巧 


学 习 Mask 的 高 级 应 用 技巧 一 一 移动 渐变 遮 章 的 运用 
Shape 变 形 动画 的 高 级 应 用 技巧 
如 何 利用 移动 渐变 遮 章 营造 精彩 的 视觉 效果 


深入 了 解 制作 产品 网 上 展示 的 基本 流程 


随 着 倒计时 的 结束 ,一 辆 新 款 跑车 不 断 地 变化 出 各 种 丰富 多 彩 的 视觉 效果 , 在 短 时 间 内 
给 浏览 者 留 下 了 深刻 的 印象 成 品 效果 如 图 15-1 一 图 15-4 所 示 。 


图 15-1 成 品 效果 之 一 


图 15-3 成品 效 果 之 三 图 15-4 成 品 效果 之 四 
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四 四 划 国 
h MX 经 典 作 


操作 步骤 


15.1 制作 网 络 广告 的 基本 场景 


Step 1 首先 启动 Flash MX， 新 建 一 个 文档 。 在 Properties 面板 中 设置 Size 为 650 x 
350Pixels，Frame Rate (速率 ) 为 20 帧 / 秒 ， 如 图 15-5 所 示 。 


Siee， 600x350pines | Backgount | FrameFate [0 fps 


区 
第 十 四 得 6_ Publsh。 FlashPlagere 


15-5 在 Properties 面板 中 设置 参数 
Step 2 双击 Layer 1 改名 为 “蓝调 。 单 击 口 工 具 ， 设置 Stroke color 为 None，Fill 
color 为 共 3333CC， 然 后 在 场景 顶端 绘制 出 如 图 15-6 所 示 的 和 矩形。 


Step 3 新建 一 个 图 层 并 命名 为 “数字 ， 使 用 A 工 具 在 场景 中 输入 1 并 按 F8 键 将 
它 转 为 Symbol (图 15-7)。 


FE 


图 15-6 绘制 矩形 图 15-7 转 为 Symbol 


Step 4 按 F6 键 在 第 10 帧 上 插入 一 个 关键 帧 并 生成 Motion Tween 动画 ， 设 置 第 10 帧 
中 文字 的 Alpha 为 0%， 如 图 15-8 所 示 。 


图 15-8 设置 Alpha 


Step 5 在 第 11 帧 上 插入 一 个 关键 帧 ， 先 将 文字 “1 删除 ， 再 使 用 人 态 工 具 在 场景 中 
相同 的 位 置 上 输入 “2 ” (图 15-9)， 同 样 也 将 它 转 为 一 个 Symbol。 


图 15-9 输入 文字 


Step 6 ”在 第 21 帧 上 插入 一 个 关键 帧 并 设置 文字 的 Alpha 为 0， 最 后 生成 Motion 
Tween 动画 (图 15--10) 。 


图 产 > 过) ER 
图 15- RE 
Step 7 使 用 同样 的 方法 将 数字 “3 ”的 Motion Tween 动画 制作 完成 ，Timeline 与 场景 
如 图 15-11 所 示 。 


15-11 Timeline 与 场景 结构 


15.2 ”制作 新 款 跑 车 的 视觉 效果 


Step 1 新 建 一 个 图 层 并 命名 为 “跑车 -Gray ， 按 F6 键 在 第 32 帧 上 插入 一 个 关键 帧 ， 
然后 选择 Filellmport (导入 ) 命令 ,在 附 赠 的 光盘 中 找到 素材 | 跑车 -Gray .jpg 文件 ， 将 此 图 
移动 到 场景 中 合适 的 位 置 (图 15-12) 。 


图 15-12 导入 图 片 
Step 2 按 F8 键 将 它 转 为 一 个 Symbol， 按 图 15-13 所 示 进 行 设 置 。 
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人 CE 
Bahavier: 入 Wovie Clip Bagistrati 蹈 . Cancel | 


广 Button 


C Gephic 人 dvanced | ielp | 
图 15-13 在 Convert to Symbol 中 设置 参数 


Step 3 按 F6 键 在 当前 层 第 100 帧 上 插入 一 个 关键 帧 并 生成 Motion Tween 动画 ,设置 
第 32 帧 中 跑车 图 形 的 Alpha 为 0 为 ， 如 图 15-14 所 示 。 


| Ealos [apha 习 [oz 可 


辐 癌 CE atance of 用 车 -Grag 图 形 
四 忆 司 [2 表 


图 15-14 设置 哆 车 图 形 的 Alpha 
Step 4 在 Properties 面板 中 查看 跑车 图 形 的 XY 坐标 (图 15-15) 。 


回 [ET 

一 E 司 | [<2L 大 
下 oo sk 
RE YE | 


| 图 15-15 查看 坐标 


Step 5 ”新 建 一 个 图 层 并 命名 为 “跑车 -RGB ， 将 它 放置 在 “跑车 -Gray 图 层 的 上 
方 (图 15-16)。 在 第 32 帧 上 插入 一 个 关键 帧 ， 选择 Filelmport 命令 ， 在 附 赠 的 光盘 中 找到 
素材 | 跑车 一 RGB.jpg 文件 ， 然 后 在 Properties 面板 中 输入 刚刚 查看 的 XY 坐标 ， 这 样 两 张 图 
片 就 完全 重合 在 一 起 了 ， 如 图 15-17 所 示 。 


| 合 儿 寺 本 本 双 C 2 To 5 二 


也 闪 吕 全 | 本 到 可 到 加 丰县 550 和 5 光 
图 15-16 新 建 图 层 图 15-17 输入 坐标 


114 


Step 6 新 建 一 个 图 层 并 命名 为 “人 遮 曾 ， 按 F6 键 在 第 32 帧 上 插入 一 个 关键 帧 ， 使 用 
叉 工 具 在 场景 中 随意 绘制 一 个 不 规则 的 图 形 ， 如 图 15-18 所 示 。 


Step 7 ”在 第 40 帧 上 插入 一 个 关键 帧 ， 使 用 o 工具 绘制 一 个 椭圆 (图 15-19) 。 


图 15-19 绘制 椭圆 


Step 8 在 第 45、 第 60 和 第 75 帧 上 分 别 插入 关键 帧 并 继续 绘制 不 规则 的 图 形 ， 如 图 
15-20 一 图 15 一 22 所 示 。 


图 15-20 绘制 不 规则 图 形 图 15-21 绘制 不 规则 图 形 
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图 15-22 绘制 不 规则 图 形 


Step 9 单 击 第 32 帧 ， 在 Properties 面板 中 将 Tween 设置 为 Shape 方式 (图 15-23) 
最 后 结果 如 图 15--24 所 示 。 


15-24 预览 效果 


Step 10 ” 单 击 第 75 帧 ， 按 Ctrl+C 组 合 键 将 所 绘图 形 复制 。 新 建 一 个 Symbol 并 命名 
为 “ 遮 单 -1"， 按 Ctrl+V 组 合 键 


图 15-25 粘贴 图 形 
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Step 11 。 单 击 有 EECSI 回 到 主场 景 ， 在 “违章 ”图 层 的 第 76 帧 上 插入 一 个 关键 帧 
按 Del 键 将 原来 的 图 形 删除 ， 然 后 打开 Library 将 “ 遮 章 -1” 元 件 拖 入 场景 中 (图 15-26)。 


图 15-26 将 元 件 拖 入 场景 


Step 12 在 第 100 帧 上 插入 一 个 关键 帧 并 生成 Motion Tween 动画 ， 在 Properties 面板 
中 按 图 15-27 所 示 设 置 动画 的 旋转 方向 。 


厂 Baopah se 了 sn 


图 15-27 设置 动画 的 旋转 方向 


Step 13 ” 单 击 第 100 帧 ， 按 Ctrl+T 组 合 键 打开 Transform 面板 ， 按 图 15--28 所 示 进 行 
设置 ， 这 样 图 形 就 会 呈现 出 由 小 逐渐 变 大 并 不 断 旋转 的 动画 效果 了 。 

Step 14 按 Ctrl+F8 组 合 键 创 建 一 个 Symbol 并 命名 为 “ 遮 罩 -2 ， 使 用 口 工具 在 场景 
中 绘制 出 如 图 15-29 所 示 的 图 形 。 


图 15-29 绘制 图 形 


“ 遮 罩 ” 图 层 的 第 101 帧 上 插入 一 个 关键 帧 ， 
按 Del 键 将 原来 的 图 形 删除 ,然后 将 “ 遮 罩 一 
2 ”元 件 拖 入 场景 中 (图 15-30) 。 


图 15-30 将 元 件 拖 入 场景 
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Step 16 ”在 当前 层 的 第 124 帧 上 插入 一 个 关键 帧 ， 使 用 么 工具 将 图 形 垂 直 缩 小 ， 如 
图 15-31 所 示 。 


图 15-31 将 图 形 垂 直 缩 小 


Step 17 在 第 145、 第 159 和 第 177 帧 上 分 别 插入 关键 帧 ， 并 将 各 关键 帧 内 的 图 形 进 
行 随意 放 缩 或 移动 ， 如 图 15-32 和 图 15--33 所 示 。 


图 15-32 插入 关键 帧 


图 15-33 放 缩 或 移动 图 形 


Step 18 ”用 鼠标 右键 分 别 单 击 第 101、 第 124、 第 145 和 第 159 帧 ， 在 弹出 的 菜单 中 
选择 Create Motion Tween (创建 运动 动画 ) ， 结 果 如 图 15-34 所 示 。 


图 15-34 生成 Motion Tween 动画 


国 | 第 15 章 ea 


Step 19 ”右键 单 击 "人 遮 罩 "图 层 , 选择 Mask 命 令 (图 15-35) , 按 下 Enter 键 预览 Timeline 
这 时 将 会 呈现 出 非常 精彩 的 遮 罩 动 画 效 果 ， 如 图 15-36 。 


Timeline 


一 生 豆 训 了 避 下 下 志 了 王 丙 五 ] 


Eee 


图 15-35 选择 Mask 命令 图 15-36 预览 Timeline 


15.3 ”继续 丰富 影片 


Step 1 先 将 “ 遮 曾 ”图 层 解 锁 (图 15-37)， 然 后 在 当前 层 的 第 182 帧 上 插入 一 个 关 
键 帧 ， 按 Del 键 将 原来 的 图 形 删 除 并 使 用 吕 工 具 绘 制 一 个 能 够 完全 覆盖 跑车 图 形 的 矩形 , 如 
15-38 所 示 。 


图 15-37 将 “ 遮 罩 ”图 层 解 锁 图 15-38 绘制 矩形 


Step 2 在 第 186 和 第 190 帧 上 分 别 插入 关键 帧 ， 然 后 将 第 186 帧 中 的 图 形 移 至 场景 
外 (图 15--39) 。 
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图 15-39 移动 图 形 


Step 3 ”重新 将 图 层 上 锁 ， 按 Enter 键 预览 Timeline， 就 会 看 到 跑车 在 一 系列 视觉 效果 
过 后 ， 将 会 呈现 出 不 断 闪烁 的 状态 (图 15-40) 。 


图 15-40 预览 Timeline 


Step 4 单 击 “ 蓝 调 ” 图 层 ， 在 第 195、 第 219 和 第 240 帧 上 分 别 插入 关键 帧 并 生成 
Shape 动画 ， 如 图 15-41 所 示 。 


Y Timeline 


大 泊 款 约 革 上 市 同上 


口 - 户 - 人 几 、 
ppJ 启 叹 


Step 5 单 击 第 219 帧 ， 使 用 沪 工 具 将 图 形 放 大 至 整个 场景 (图 15-42) 。 


图 15-42 将 图 形 放 大 至 整个 场景 


Step 6 单 击 第 240 帧 ， 使 用 * 工具 按 图 15-43 所 示 将 图 形 进行 曲线 调节 。 


NT CD 


HHW, 6， 
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图 15-43 进行 曲线 调节 


Step 7 ” 按 F5 键 将 所 有 图 层 的 时 间 轴 延长 至 第 270 帧 ， 最 后 Timeline 结构 应 如 图 
15-44 一 图 15 一 46 所 示 。 


1100 105 110 15 120 125 130 135 140 145 ”150 


图 15-45 Timeline 结构 
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图 15-46 _ Timeline 结构 
15.4 小结 


通过 本 章 的 练习 ,我们 已 经 掌握 了 制作 网 上 产品 广告 的 基本 流程 和 制作 思路 , 并 学 会 
如 何 通过 简单 的 技巧 不 断 变化 、 组 合 出 非常 精彩 的 视觉 效果 。 当 然 在 制作 和 创意 的 过 程 中 ， 
要 以 制作 目的 为 基础 ， 所 有 的 制作 都 是 为 了 产品 的 宣传 服务 的 ， 而 不 是 言 目地 追求 视觉 效 
果 ， 同 时 还 要 考虑 到 浏览 者 的 网 络 情况 ， 要 在 诸多 限制 中 寻求 一 个 平衡 。 


位 2 
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深入 学 习 Flash 动画 的 各 种 制作 技巧 
如 何在 Timeline 中 插入 空白 关键 帧 
如 何 将 优秀 的 创意 融入 Flash 公 益 广 告 之 中 
通过 编辑 Actions 实现 影片 的 跳 转 与 循环 播放 


熟练 掌握 网 络 宣传 动画 的 制作 技巧 与 基本 流 


预览 成 品 


这 是 一 个 简单 的 网 络 宣传 动画 , 它 通过 模拟 两 个 人 在 网 上 聊天 而 引发 出 动画 的 主题 , 如 
图 16-1 和 图 16 一 2 所 示 。 


艳 - 网 上 的 MM 邦 邦 


图 16-1 成 品 效果 之 一 图 16-2 成 品 效果 之 二 


16.1 ”模拟 网 络 聊天 的 动画 效果 


Step 1 启动 Flash MX , 新 建 一 个 文档 。 在 Properties 面 板 中 设置 Size 为 400 x 250Pixels ， 
Background 背景 色 设 定 为 共 4281B9 (图 16 一 3 ) 。 
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图 16-3 在 Properties 面板 中 设置 参数 


Step 2 双击 Layer 1 改名 为 “缩小 图 ”， 选 择 FilelImport (导入 ) 命令 ,在 附 赠 的 光盘 
中 找到 素材 |oicq.jpg 文件 ， 并 用 里 工 具 将 图 形 缩小 至 702% ， 如 图 16 一 4 所 示 。 

Step 3 按 F5 键 将 时 间 轴 延长 至 32 帧 ， 新 建 一 个 图 层 并 命名 为 “光标 ， 使 用 “工具 
画 一 条 竖 线 模拟 对 话 框 中 的 光标 (图 16 一 5)。 


图 16-4 导入 图 片 图 16-5 绘制 光标 


Step 4 按 F6 键 在 当前 层 的 第 9、 第 17 和 第 25 帧 上 分 别 插入 关键 帧 ， 然 后 用 鼠标 右 
键 单 击 第 5 帧 ， 在 弹出 的 菜单 中 选择 nsert Blank Keyframe (插入 空白 关键 帧 ) ， 如 图 15-6 
所 示 。 
step 5 ”使 用 同样 的 方法 在 第 13、 第 21 和 第 29 帧 上 分 别 插入 空白 关键 帧 ，Timeline 
结构 如 图 16-7 所 示 ， 按 下 Enter 键 预览 Timeline， 光 标 闪烁 的 动画 效果 就 制作 完成 了 。 


图 16-6 播 入 空白 关键 帧 
Step 6 新建 一 个 图 层 并 命名 为 “放大 图 ”, 在 第 33 帧 上 插入 一 个 关键 帧 , 然后 将 Library 


中 的 图 片 拖 入 场景 中 并 按 CtrlI+T 组 合 键 打开 Transform 面板 , 按 图 16-8 所 示 进 行 设置 , 最 后 
效果 如 图 16-9 所 示 。 


| 117.1% 二 | 117.1% 


图 16-8 _ Transform 面板 图 16-9 预览 效果 
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Step 7 单 击 “ 光 标 ” 图 层 ， 在 第 40 和 第 60 帧 上 分 别 插入 关键 帧 ， 使 用 全 工具 随意 
输入 一 些 文字 (图 16-10) 。 


图 16-10 插入 关键 帧 


Step 8 ”新建 一 个 图 层 并 命名 为 “光标 诞 章 ， 在 第 60 帧 上 插入 关键 帧 ， 然 后 使 用 品 
工具 绘制 出 如 图 16--11 所 示 的 遮 罩 图 形 。 


图 16-11 绘制 遮 罩 图 形 


Step 9 按 F8 键 将 其 转 为 Symbol， 在 当前 层 的 第 90 帧 上 插入 一 个 关键 帧 ， 将 遮 单 图 
形 向 右 移动 至 能 够 完全 覆盖 文字 的 位 置 并 生成 Motion Tween 动画 (图 16 一 12)。 


图 16-12 生成 Motion Tween 动画 

Step 10 ”用 鼠标 右键 单 击 “ 光 标 遮 罩 ”图 层 ， 在 弹出 的 菜单 中 选择 Mask 选项 ， 这 
样 就 模拟 出 文字 输入 的 动画 效果 了 。 按 F5 键 将 三 个 图 层 的 时 间 轴 都 延长 至 130 帧 ， 如 图 
16--13 所 示 。 


办 四 井 国 
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图 16-13 延长 时 间 轴 


Step 11 新建 一 个 图 层 并 命名 为 “Error ”， 在 第 105 帧 上 插入 关键 帧 ， 使 用 ”工具 绘 
制 出 如 图 16 一 14 所 示 的 图 形 。 


哎 ”网 上 的 MM 都 是 


图 16-14 绘制 图 形 
Step 12 ” 按 F8 键 将 其 转 为 Symbol (图 16-15)， 在 第 121 帧 上 插入 一 个 关键 帧 并 生 
成 Motion Tween 动 画 。 单 击 第 105 帧 ， 按 Ctrl+T 组 合 键 打开 Transform 面板 ， 按 图 16--16 所 
示 将 图 形 等 比 放大 500%。 


图 16-15 转 为 Symbol 图 16-16 在 Transform 面板 中 设置 放大 比率 
Step 13 ”用 逐 帧 动画 方式 (图 16-17) 模拟 出 画面 振动 的 效果 。 


避 可 对 加 [90 Tizafs [om 可 
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16.2 ”主题 宣传 的 动画 效果 


Step 1 新 建 一 个 图 层 并 命名 为 “背景 ， 在 第 131 帧 上 插入 一 个 关键 帧 ， 使 用 口 工具 
绘制 出 如 图 16--18 所 示 的 背景 图 形 。 

Step 2 ”新 建 一 个 图 层 并 命名 为 “文字 ， 在 第 131 帧 上 插入 关键 帧 ， 使 用 A 工 具 在 
场景 中 随意 输入 一 些 文字 (图 16--19 ) 。 


人 
图 16-18 绘制 背景 图 16-19 输入 文字 
Step 3 ”使 用 同样 的 方法 制作 出 文字 的 高 光 和 阴影 (图 16-20)，Timeline 结构 如 图 
16--21 所 示 。 


人 让 放 到 本 
图 16-20 制作 出 文字 的 高 光 和 阴 图 16-21 Timeline 结构 
Step 4 按 Ctrl+F8 组 合 键 创 建 一 个 Symbol， 按 图 16 一 22 所 示 进 行 设置 。 


图 16-22 创建 Symbol 
Step 5 选择 Filellmport (导入 ) 命令 ， 在 附 赠 的 光盘 中 找到 素材 |girl .jpg 文件 ， 然 后 
使 用 许 工 具 配 合 Alt 键 将 图 像 水 平复 制 两 次 ， 如 图 16 一 23 所 示 。 


图 16-23 水 平复 制图 像 


Step 6 ” 按 有 ES 国 按钮 回 到 主场 景 ， 新 建 一 个 图 层 并 命名 为 “图 片 ， 将 它 放置 在 
“文字 ”图 层 的 下 方 (图 16-24) 。 在 当前 层 的 第 131 帧 上 插入 一 个 关键 帧 ， 然 后 将 Library 中 
的 图 片 元 件 拖 入 到 场景 中 ， 如 图 16 一 25 所 示 。 


Timehine 


图 16-25 将 图 片 拖 入 场景 
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Step 7 在 当前 层 的 第 141、 第 171、 第 181 和 第 211 帧 上 分 别 插入 关键 帧 ， 并 生成 不 
断 移 动 的 Motion Tween 动画 效果 (图 16--26 ) 。 


图 16-26 生成 Motion Tween 动画 


Step 8 ”用 鼠标 右键 单 击 “文字 ”图 层 ， 在 弹出 的 菜单 中 选择 Mask 选项 (图 16 一 27) , 
按 下 Enter 键 预览 Timeline， 效 果 很 不 错 吧 


h MX - [ 苇 十 六 章 " 同 烙 无 和 美女 ` 宜 传动 画 ] 
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图 16-27 


Step 9 单 击 第 211 帧 ， 在 Action 面板 中 双击 goto 命令 并 在 Frame 后 面 的 对 话 框 中 输 
入 131， 如 图 16-28 所 示 。 


T Actions - Frame 


图 Achons for Frame 211 of Layer Name 图 片 
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图 16-28 在 Action 面板 中 设置 参数 
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所 有 的 制作 都 完成 了 , 按 下 Ctrl+Enter 组 合 键 进行 预 览 , 如 确定 没有 问题 后 选择 File|Export 
Movie 命令 输出 成 .Swf 格式 文件 进行 发 布 。 


16.3 “小 结 

本 章 主要 讲述 了 Flash 网 络 宣传 动画 的 制作 技巧 与 基本 流程 ， 同 时 也 深入 地 介绍 了 制作 
Flash 动 画 的 各 种 方法 , 以 及 如 何 通过 简单 的 动画 技巧 表现 出 复杂 的 视觉 效果 和 精彩 创意 。 当 
掌握 完 所 有 的 学 习 步 骤 后 , 如 果 大 家 感到 意犹未尽 的 话 ,赶快 运用 所 学 的 知识 去 做 一 个 属于 
自己 的 网 络 动画 吧 ! 


办 四 井 国 


商业 迷你 网 站 片头 动画 
本 章 重 点 


学 习 和 掌握 制作 商业 网 站 片头 的 方法 与 技巧 
合理 地 利用 文件 夹 对 Library 进行 分 类 管理 


利用 Motion Tween 和 Shape 等 动画 方式 创造 出 精彩 的 视觉 效果 


本 章 展示 了 商业 迷你 网 站 片头 动画 的 制作 方法 与 技巧 ,以 及 如 何在 短 时 间 内 创造 出 丰富 
的 画面 效果 ， 如 图 17-1 和 图 17 一 2 所 示 。 


17-1 成 品 效果 之 一 图 17-2 成品 效 果 之 二 


操作 步骤 


17.1 制作 基本 动画 场景 


Step 1 启动 Flash MX , 新 建 一 个 文档 , 在 Properties 面 板 中 设置 Size 为 550 x 400Pixels ， 
Background 背景 色 为 共 CCCCFF， 其 他 保持 默认 (图 17-3) 。 


四 四 区 国 
h MX 经 典 作 


Documem She ， 珊 a0gpiele_ | Baskgromt [Famepae [2 由 


| 有 Publek ee 
图 17-3 和 epilea 面板 中 设置 参数 


Step 2 ”双击 Layer 1 改名 为 “背景 ”， 选 择 FilelImport (导入 ) 命令 ， 在 附 赠 的 光盘 中 
找到 素材 | 背景 图 片 .jpg 文件 ， 然 后 将 此 图 移动 到 合适 的 位 置 (图 17 一 4) 。 


图 17-4 导入 图 片 
| Step 3 按 F8 键 将 其 转 为 一 个 Symbol， 并 在 Properties 面板 中 设置 Alpha 为 44926 ， 如 
17--5 所 示 。 


图 17-5 设置 Alpha 


Step 4 新 建 一 个 图 层 并 命名 为 “透明 ， 将 它 拖 至 底层 。 单 击 豆 工 具 ， 在 Color Mixer 
面板 中 按 图 17--6 所 示 进 行 设 置 ， 然 后 在 场景 中 绘制 出 图 17 一 7 所 示 的 渐变 图 形 。 


图 17-6 Color Mixer 面板 图 17-7 绘制 渐变 图 形 
Step 5 按 F6 键 在 当前 层 的 第 20 帧 上 插入 一 个 关键 帧 ， 单 击 第 1 帧 ， 使 用 瘟 工 具 将 
图 形 水 平 缩 小 (图 17-8) 。 
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图 17-8 将 图 形 水 平 缩小 


Step 6 在 Properties 面板 中 将 Tween (动画 方式 ) 设置 为 Shape (图 17-9)， 这样 就 
形成 了 一 个 半 透 明 状态 的 遮 章 动画 ， 如 图 17--10 所 示 。 


Frame 


“于 Frame Label 


Tweer | Shape 
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图 17-10 制作 动画 


17.2 ”页面 元 素 的 动态 设计 


Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 命 名 为 “背景 动画 ”!( 图 17-11)。 使 用 
口 工具 在 场景 中 绘制 一 个 细 长 的 矩形 并 将 其 转 为 Symbol， 如 图 17-12 所 示 。 


改 等 尝 民 


头 动画 


上 
1 


17 
辕 人 Le 商业 迷你 网 站 上 


图 17-15 关键 帧 位 置 图 17-16 场景 结构 


Step 5 按 Ctrl+F8 组 合 键 创建 一 个 Symbol 并 命名 为 “ 光 ， 单 击 


@ 工具 配合 Shift 键 在 场景 中 绘制 一 个 圆 形 (图 17-17)。 
Step 6 ”在 第 80 帧 上 插入 一 个 关键 帧 ， 使 用 o 工具 继续 绘制 三 
个 圆 形 , 最 后 生成 Shape 动 画 (图 17-18), 图 形 的 运动 轨迹 如 图 17 一 19 


所 示 。 图 17-17 绘制 圆 形 


图 17-18 生成 Shape 动画 图 17-19 图 形 的 运动 轨迹 


17.3 丰富 动画 的 视觉 效果 
Step 1 按 有 ER 加 到 主场 景 ， 新 建 一 个 “背景 动画 ”图 层 并 将 它 拖 至 最 底层 ， 然 后 
将 Library 中 与 之 相对 应 的 元 件 拖 入 场景 中 (图 17 一 20) 。 


图 17-20 将 元 件 拖 入 场景 中 


Step 2 ”新 建 一 个 图 层 ， 将 Library 中 “ 光 ” 元 件 拖 入 场景 中 ， 使 用 上 工具 配合 Alt 键 
) 将 元 件 进行 重复 复制 ， 如 图 17-21 所 示 。 
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图 17-21 重复 复制 


Step 3 ”页 面 上 文字 的 动态 效果 是 通过 Mask 功能 来 实现 的 ， 如 图 17 一 22 和 图 17 一 23 
所 示 。 


图 17-22 Timeline 结构 图 17-23 文字 的 动态 效果 


Step 4 按 F5 键 将 所 有 图 层 的 时 间 轴 延长 至 105 帧 。 新 建 一 个 图 层 并 命名 为 ” 线 一 
1 ， 在 第 45 帧 上 插入 一 个 关键 帧 ， 使 用 轴 工 具 在 场景 中 国 一 条 非常 短 的 线段 (图 17 一 24) 。 
Step 5 在 当前 层 第 60 帧 上 插入 关键 帧 ， 使 用 下 工具 将 线段 延长 ， 如 图 17 一 25 所 示 。 


图 17-24 绘制 线段 图 17-25 延长 线段 


Step 6 单 击 当 前 层 第 45 帧 ， 在 Properties 面板 中 设置 Tween (动画 方式 ) 为 Shape， 
如 图 17--26 所 示 。 
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17-27 Timeline 结构 


站 EU115Dio jhof.. … 国 
芝 委 


图 17-28 其 余 三 条 线段 的 变形 动画 
Step 8 新 建 一 个 图 层 ， 在 第 72 帧 上 插入 一 个 关键 帧 ， 选 择 FilellImport (导入 ) 命令 ， 
在 附 赠 的 光盘 中 找到 素材 |zuo.jpg 文件 ， 然 后 将 此 图 移动 至 图 17-29 所 示 的 位 置 并 按 F8 键 


eufEBompor. 轩 
17-29 导入 图 片 


Step 9 在 第 77 帧 上 插入 一 个 关键 帧 并 生成 Motion Tween 动画 ， 设 置 第 72 帧 中 图 形 
的 Alpha 为 10%， 如 图 17--30 所 示 。 


17-30 设置 Alpha 


Step 10 新建 一 个 图 层 ， 在 第 73 帧 上 插入 一 个 关键 帧 ， 选 择 Filellmport 命令 ， 在 附 
赠 的 光盘 中 找到 素材 |you.jpg 文件 ， 按 照 同样 的 方法 生成 Motion Tween 动画 (图 17-31)， 
Timeline 结构 如 图 17--32 所 示 。 
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图 17-32 Timeline 结构 


Step 11 利用 所 学 的 知识 并 结合 自己 的 想像 力 继 续 丰 富 页 面 的 视觉 效果 (图 17-33)， 
Timeline 结构 如 图 17--34 所 示 。 


Timeline 
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图 17-34 Timeline 结构 
17.4 小结 


本 章 模拟 制作 了 一 个 简单 的 迷你 网 页 片头 动画 ,目的 是 让 大 家 了 解 利用 Flash 制作 个 人 


主页 或 商业 网 站 片头 动画 的 基本 流程 和 制作 思路 ， 以 及 如 何 营造 出 非常 精彩 的 动态 视觉 效 
果 。 当 然 在 实际 的 制作 过 程 中 ,进行 一 个 Flash 网 页 开发 可 能 要 涉及 两 方面 的 人 员 : 网 页 设 
计 师 和 技术 人 员 。 我 们 的 工作 是 进行 整体 风格 和 元 素 的 设计 与 制作 , 而 技术 人 员 是 在 设计 师 
的 创作 基础 上 进行 整体 项 目的 功能 开发 和 流程 控制 等 工作 . 相信 在 实际 的 应 用 中 , 我们 会 总 
结 出 大 量 的 经 验 ， 从 而 更 快 地 提高 自己 的 水 平 。 


网 络 消息 广播 系统 


本 章 重点 


| 性 如 何在 Flash 个 人 主页 中 制作 具有 交互 性 的 消息 广播 系统 
| 剧 利 用 简单 的 动画 与 Actions 模拟 复杂 的 网 络 程序 


深入 学 习 如 何 通 过 按钮 和 Actions 来 控制 影片 的 播放 顺序 


本 章 模拟 制作 了 一 个 网 络 消息 的 广播 系统 ， 浏 览 者 可 以 通过 按钮 来 控制 消息 的 播放 顺 
序 ， 如 图 18-1 和 图 18 一 2 所 示 。 


E 2001 年 9 睛 20 昌 -10 及 17 昌 将 和 中 二 


图 18-1 成 品 效果 之 一 图 18-2 成品 效 果 之 二 


18.1 制作 系统 所 需要 的 基本 元 素 


Step 1 启动 Flash MX， 新 建文 档 。 在 Properties 面板 中 设置 Size 为 380 x 65Pixels ， 
Background (背景 色 ) 设 定 为 共 E6E6E6， 其 他 保持 默认 (图 18--3)。 


Properties 
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图 18-3 在 Properties 面板 中 设置 参数 


Step 2 双击 Layer 1 改名 为 “背景 ， 选择 FilellImport 命令 ， 在 附 赠 的 光盘 中 找到 素 
材 | 网 络 消息 背景 .jpg 文件 ， 并 使 用 * 工具 将 其 调整 到 合适 位 置 ， 如 图 18-4 所 示 。 


图 18-4 导入 图 片 


Step 3 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 按 图 18-5 所 示 进 行 设 置 。 使 用 A 工 具 ， 
设置 填充 色 为 站 333333， 在 场景 中 输入 “Do you know 字样 (图 18-6). 
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图 18-5 新 建 Symbol 图 18-6 输入 文字 


Step 4 在 “文字 ”图 层 的 下 面 新 建 一 个 图 层 ， 并 按 F5 键 将 所 有 图 层 的 时 间 轴 延长 至 
70 帧 ， 如 图 18--7 所 示 。 


Timeline 


图 18-7 延长 时 间 轴 
Step 5 在 当前 层 中 ， 使 用 后 工具 绘制 出 如 图 18--8 所 示 的 图 形 ， 并 按 F8 键 将 它 转 为 


一 个 Symbol 。 


图 18-8 绘制 图 形 


Step 6 在 第 30 帧 处 插入 一 个 关键 帧 并 生成 Motion Tween 动画 ， 将 第 30 帧 的 图 形 向 
右 移 动 至 能 够 完全 覆盖 文字 的 位 置 (图 18-9)。 
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Do yod:know | 于 


图 18-9 生成 Motion Tween 动画 


Step 7 ”用 鼠标 右键 单 击 “文字 ”图 层 ， 在 弹出 的 菜单 中 选择 Mask 选项 ， 结 果 如 图 
18--10 所 示 。 


Do you:KkKnow 


图 18-10 执行 Mask 


Step 8 新 建 一 图 层 ， 使 用 全 随意 输入 一 些 符号 图 形 ， 最 后 效果 如 图 18-11 所 示 


Do you:know ?3? 


图 18-11 输入 符号 图 形 


Step 9 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 设 置 Behavior 为 Button (图 18--12) 
Step 10 在 Up 影 帧 下 ， 使 用 久 工 具 绘制 出 如 图 18--13 所 示 的 图 形 。 


Create New Symbol 


[这 
Bahevior: C Wovis Oipy Cancel 
入 一 | 


广 Graphic 
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图 18-12 新 建 Symbol 图 18-13 绘制 图 形 


Step 11 按 F6 键 在 Over 和 Down 影 帧 中 分 别 插入 一 个 关键 帧 (图 18-14) ， 然 后 单 击 
Over 影 帧 ， 将 按钮 的 填充 色 设 置 为 共 FFCC00， 如 图 18--15 所 示 。 


图 18-14 插入 关键 帧 图 18-15 填充 颜色 


Step 12 ， 按 Ctrl+L 组 合 键 打 开 Library， 用 鼠标 右键 单 击 “ 按 钮 ”元 件 并 选择 Duplicate 
(复制 ) 命令 (图 18-16) ， 在 弹出 的 Duplicate Symbol 对 话 框 中 按 图 18--17 所 示 进 行 设置 ， 
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图 18-16 复制 按钮 图 18-17 在 Duplicate Symbol 对 话 框 中 设置 参数 


Step 13 在 Library 中 双击 该 按钮 进入 编辑 状态 ， 单 击 Up 影 帧 ， 选 择 菜单 Modify | 
Tranform | Filp Horizontal (水 平 镜 像 ) 命令 ， 最 后 结果 如 图 18-18 所 示 。 

Step 14 ”使 用 相同 的 方法 分 别 将 Over 和 Down 影 帧 中 的 按钮 图 形 进行 水 平 镜像 (图 
18 一 19) 。 
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图 18-18 水 平 镜像 图 18-19 水平 镜 像 
18.2 ”制作 具有 交互 性 的 消息 广播 系统 


Step 1 按 有 RE S 生 加 到 主场 景 ， 新 建 一 个 图 层 ， 将 Know ”元 件 拖 入 场景 中 图 18 一 
20 所 示 的 位 置 。 


Timeline 
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图 18-20 将 元 件 拖 入 场景 


Step 2 按 CtrlI+F8 组 合 键 创建 一 个 Symbol 并 命名 为 “消息 ”， 双 击 Layer 1 改名 为 
“文字 ” 使 用 名 工具 在 场景 中 输入 要 广播 的 内 容 (图 18-21), 然后 按 F8 键 将 其 转 为 Symbol。 
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图 18-21 输入 文字 


Step 3 在 第 251 帧 上 插入 一 个 关键 帧 ， 将 文字 向 左 水 平移 动 并 生成 Motion Tween 动 
画 ， 如 图 18--22 所 示 。 
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图 18-22 生成 Motion Tween 动画 


Step 4 单 击 第 251 帧 ， 在 Actions 面板 中 双击 Stop 命令 (图 18-23)， 然 后 按 F7 键 在 
第 253 帧 上 插入 一 个 空白 关键 帧 (图 18 一 24) 。 
ER 
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图 18-23 Actions 面板 


图 18-24 插入 空白 关键 帧 


Step 5 按 F6 键 在 第 254 帧 上 插入 一 个 关键 帧 ， 使 用 同样 的 方法 制作 第 二 条 广播 内 
容 ， 并 在 结尾 处 设置 Stop 命令 ， 如 图 18--25 所 示 。 


Timeline 


芭 帮 behavior 中 选择 Popup Message 就 可 以 了 ， 足 不 是 很 简单 ? 


图 18-25 制作 第 二 条 广播 内 容 


Step 6 按 有 BE 9 靖 器 到 主场 景 ， 新 建 一 个 图 层 ， 将“ 消息” 元件 拖 入 场景 中 并 用 鼠 
标 右键 单 击 ， 在 弹出 的 菜单 中 选择 Edit In Place ( 原 地 编辑 ) 命令 (图 18-26)， 然 后 根据 
其 他 元 件 的 位 置 进行 深入 调整 。 
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图 18-26 选择 Edit In Place 命令 


Step 7 在 文字 ”图 层 的 上 方 新 建 一 个 “ 遮 章 ”图 层 ， 使 用 口 工 具 在 场景 中 绘制 一 
个 矩 形 作为 文字 的 遮 章 ， 如 图 18 一 27 所 示 。 


Timeline 


Do you know 
0 征 上 征 将 在 中 华 世 纪 攻 


图 18-27 制作 遮 章 


Step 8 ”右键 单 击 “ 遮 章 ” 图 层 并 选择 Mask 命令 ， 按 下 Enter 键 预览 Timeline， 最 后 效 
果 如 图 18-28 所 示 。 
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Sh MX 经 典 作 


|-10 月 17 日 将 和 禁 中 华 世 纪 坛 洒 乡 


图 18-28 预览 Timelin 


Step 9 新建 一 个 图 层 并 命名 为 “按钮 ， 在 第 2 帧 上 插入 一 个 关键 帧 ， 将 Library 中 
的 两 个 按钮 元 件 拖 入 到 场景 中 ， 位 置 如 图 18-29 所 示 。 
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图 18-29 拖 入 按钮 元 件 至 场景 中 
Step 10 单 击 “ 向 前 ”按钮 ， 在 Actions 面板 中 按 图 18-30 所 示 进 行 设置 。 
| 怨 PR 【自明 ) 
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图 18-30 设置 Actions 


Step 11 单 击 “向 后 ”按钮 ,在 Actions 面板 中 按 图 18-31 所 示 进 行 设置 


148 
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图 18-31 设置 Actions 
Step 12 返回 主场 景 ， 按 下 Ctrl+Enter 组 合 键 进 行 预览 ， 最 终 效果 如 图 18-32 所 示 。 
呆 因 
手 9 月 20 日 -10 瑟 17 日 将 和 酝 申 华 岂 红 二 蔡 办 《 渔 
图 18-32 最 终 效 果 
Be 小结 
在 本 章 中 ,我们 利用 了 简单 的 动画 效果 与 Actions 模拟 了 一 个 具有 交互 性 的 网 络 消息 广 


播 系统 ,同时 也 了 解 了 制作 Flash 网 页 动画 的 基本 流程 和 制作 思路 。 只 要 掌握 一 定 的 学 习 方 
法 和 思考 问题 的 方式 ， 无 论 在 将 来 遇 到 什么 样 的 问题 都 会 迎刃而解 。 
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利用 Flash MX 中 的 动画 功能 制作 出 逼真 的 光线 特效 
\ 恩 通过 重复 利用 元 件 组 合 出 复杂 的 视觉 效果 
(办 使 用 Advanced Effect 工具 深入 调整 图 像 的 色彩 和 透明 度 


( 园 将 影片 片段 装载 到 主场 景 中 形成 反复 循环 的 动画 


本 章 通 过 Flash 中 Motion Tween 与 逐 帧 动画 的 方式 制作 出 非常 逼真 的 光线 特效 ,如 图 19- 
1 和 图 19-2 所 示 。 


图 19-1 成 品 效果 之 一 图 19-2 斋 品 效果 之 二 
操作 步骤 
19.1 制作 光线 的 基本 特效 


Step 1 启动 Flash MX , 新 建 一 个 文档 。 在 Properties 面 板 中 设置 Size 为 393 x 400Pixels 
Background 背景 色 设 定 为 共 000000， 其 他 保持 默认 (图 19-3)。 
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图 19-3 在 Properties 面板 中 设置 参数 
step 2， 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 并 命名 为 “光线 动画 ” (图 19-4)。 选 择 
File | Import 命令 , 在 附 赠 的 光盘 中 找到 素材 | Fire.jpg 文 件 , 将 此 图 导入 场景 中 并 调整 到 合 
适 位置 (图 19-5)， 然 后 按 F5 键 将 时 间 轴 延长 至 第 30 帧 处 。 
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矿 Button 
人 广 Graphic | help | http:/ibestyy.51.net 


图 19-4 新 建 Symbol 图 19-5 导入 图 片 


Step 3 ”新 建 一 个 图 层 并 命名 为 “Light-1 ， 按 F6 键 在 第 5 帧 上 插入 一 个 关键 帧 ， 导 
入 附 赠 光盘 中 的 素材 | Light .jpg 文件 ， 然 后 使 用 豆 工 具 将 图 形 调 整 至 合适 大 小 并 按 F8 键 将 
它 转 为 Symbol， 如 图 19--6 所 示 。 


http://bestyy.51.net 


图 19-6 转 为 Symbol 


Step 4 在 第 6 帧 上 插入 一 个 关键 帧 ， 使 用 冯 工 具 将 图 形 沿 水 平方 向 缩小 (图 19 一 7) 
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图 19-7 将 图 形 沿 水 平方 向 缩小 


Step 5 在 第 7 和 第 8 帧 上 分 别 插入 关键 帧 ， 使 用 叱 工具 按 图 19-8 和 图 19--9 所 示 将 
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图 19-8 调整 光线 图 形 图 19-9 调整 光线 图 形 


Step 6 ”在 第 9 和 第 11 帧 上 分 别 插入 关键 帧 ， 将 图 形 沿 水 平方 向 缩小 并 生成 Motion 
Tween 动画 (图 19--10) 。 

Step 7 ”在 第 12 和 第 13 帧 上 插入 关键 帧 ， 使 用 所 工具 继续 调整 ， 最 后 效果 如 图 19 
11 所 示 ， 
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图 19-10 生成 Motion Tween 动画 图 19-11 最 后 效果 
19,2 ”深入 制作 光线 的 视觉 效果 
Step1 在 当前 层 的 第 14、 第 15、 第 16 和 第 17 帧 上 分 别 插入 一 个 关键 帧 ， 然 后 单 击 


第 14 帧 内 的 光线 图 形 ， 在 Properties 面板 中 设置 其 Color 为 Advanced (高 级 设置 ) ， 如 图 19- 


12 所 示 。 


[Ge 可 | Geo 咒 | 6or [aaaeed 本 
Ce me 


四 19-12 ”Properties 面板 


| 


Step 2 单 击 Settings 按钮 ， 在 弹出 的 对 话 框 中 按 图 19--13 所 示 进 行 设置 。 
Step 3 单 击 第 15 帧 内 的 光线 图 形 ， 按 图 19-14 所 示 设 置 Advanced Effect 。 


Advanced Effect 了 | Advanced Effect 村 重 .1| 


edu=[sx 可 xzapkp 
Green = [5x ET 7 
Mue=sxy “了 xD E 
Apha=[sx  “ En 有 


图 19-13 设置 Advanced Effect 图 19-14 设置 Advanced Effec 


( 仿 | 第 19 章 四 Flash 动 画 特效 | 


Step 4 分别 设 置 第 16 和 第 17 帧 内 光线 图 形 的 Advanced Effect (图 19-15 和 图 19--16) 


advanced Effect 浊 | Advanced Effect 理 | 


Red = Psx = 引 了 -1192 m Red = 本 了 | xR) |255 Y 
Green = Psx w| xG) |192 Y Green = 区 | x 6G) |255 Y 
ass = xa [sz -| nue= 奈 才 冯 助 Env 


Nipha=jsx 了 xp | Apha =[Fsx -| xn 所 ~ 


19-15 第 16 帧 的 Advanced Effect 图 19-16 第 17 帧 的 Advanced Effect 


Step 5 按 F7 键 在 第 18 帧 上 插入 一 个 空白 关键 帧 ，Timeline 结构 如 图 19--17 所 示 


本 7 避 FF7I 下 本] 


图 19-17 Timeline 结构 


Step6 将 Light-1 图 层 的 显示 状态 关闭 (图 19-18)。 新 建 “Light-2” 图 层 ,在 
第 4 帧 上 插入 一 个 关键 帧 ， 然 后 将 Library 中 的 “Light ”元件 拖 入 场景 中 并 使 用 豆 工 具 进 行 调 
整 ， 如 图 19-19 所 示 。 


Timeline 
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图 19-18 关闭 显示 状态 图 19-19 调整 图 形 


Step 7 单 击 光线 图 形 ， 在 Properties 面板 中 设置 Color 为 Tint (图 19-20) 最 后 效果 
如 图 19--21 所 示 。 


图 Sh_ MX 


福 
经 


加 | [ee 可 | wmeo 和 caesfr 可 [Jo 
| Swwp_ | [cn 避 Pa[ | | 下 
w [rz 类 Ps3 
帮 放 放 丰 ” 
图 19-20 在 Properties 面板 中 设置 参数 图 19-21 预览 效果 


Step 8 在 第 5 和 第 6 帧 上 分 别 插入 关键 帧 ， 使 用 所 工具 按 图 19-22 和 图 19-23 所 示 


对 图 形 进行 调整 


http:ibestyy.51.net 
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图 19-22 调整 图 形 图 19-23 调整 图 形 


Step 9 在 第 10 一 第 14 帧 上 分 别 插入 
关键 帧 , 使 用 同样 的 方法 继续 调整 , 如 图 19 一 
24 一 图 19 一 28 所 示 。 
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图 19-24 在 第 10 帧 调整 图 形 
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图 19-25 在 第 11 帧 调整 图 形 图 19-26 在 第 12 帧 调整 图 形 


图 19-27 在 第 13 帧 调整 图 形 图 19-28 在 第 14 帧 调整 图 形 


Step 10 ” 按 F7 键 在 第 7 和 第 15 帧 上 分 别 插入 空白 关键 帧 ，Timeline 结构 如 图 19 一 29 
所 示 。 


ER 
本 


和 司 ] 宕 


图 19-29 Timeline 结构 


j 四 | 品 | 28 |120fps | 2.3s 1 i 


Step 11 ” 回 到 主场 景 ， 按 Ctrl+L 组 合 键 打开 Library， 将 “光线 动画 ”元 件 拖 入 到 场 
景 中 (图 19-30)， 然 后 按 下 CtrlI+Enter 组 合 键 进 行 预览 ， 最 终 效果 如 图 19-31 所 示 


国 国 鸭 国 
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图 19-30 把 Library 中 的 元 件 拖 入 场景 图 19-31 最终 效 果 


19.3 小 结 


通过 本 章 的 学 习 ,我 们 掌握 了 更 多 的 关于 制作 视觉 特效 的 方法 与 技巧 , 将 这 些 动 画 效果 
应 用 到 你 的 Flash 动画 、 个 性 网 页 或 演示 文稿 中 ,一 定 会 为 你 的 作品 增色 不 少 。 在 制作 视觉 
效果 前 ,要 先 明确 自己 想 要 制作 出 什么 样 的 效果 ? 如何 去 实现 在 脑子 里 面 完整 的 思考 一 遍 
或 者 画 出 草图 后 才 可 以 动手 ， 切 勿 在 没有 准备 的 情况 下 言 目 制作 。 


第 20 章 SEE | 


掌握 制作 Flash 节 月 贺卡 的 基本 流程 
深入 了 解 交 互 按钮 在 Flash 动 画 中 的 应 用 
如 何 将 影片 片段 装载 到 按钮 的 Over 状态 中 


利用 Actions 中 跳 转 至 影 由 命令 精确 控制 影片 的 播放 


当 收 到 好 友 在 节日 期 间 送 给 你 的 礼物 时 , 想 不 想 打开 看 看 里 面 到 底 会 有 什么 惊喜 呢 》 如 
20-1 和 图 20--2 所 示 。 


图 20-1 成 品 效果 之 一 图 20-2 成 品 效果 之 二 


四 多 昌国 
h MX 经 典 作 品 解 析 | 人 
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20.1 制作 动画 的 基本 元 素 
Step 1 


新 建 一 个 空白 文档 ， 在 Properties 面板 中 设置 Size 为 350 x 550Pixels，Background 
设 定 为 共 FCF236， 其 他 保持 默认 (图 20-3) 。 


A Document Sie 350x550phels_ |。 Background | -| FrameRate [2 


fps 
划 十 九 午 ?. Publish。 ”Flash Player6 


图 20-3 在 Properties 面板 中 设置 参数 


Step 2 按 Ctrl+F8 键 新 建 一 个 Symbol 并 命名 为 “红心 ” 单 击 工具 ,设置 Pencil Mode 
为 Smooth (光滑 ) 方式 (图 20-4)， 在 场景 中 绘制 出 红心 的 外 轮廓 ， 如 图 20-5 所 示 。 


月 
| suaahten 
| mk 


图 20-4 设置 Pencil Mode 图 20-5 绘制 红心 的 外 轮廓 


Step 3 ”使 用 “工具 画 出 明暗 交界 线 并 用 * 工具 将 直线 调整 为 曲线 (图 20-6)。 


图 20-6 调整 曲线 


@ 节日 的 | 


Step 4 单 击 & 工 具 ， 设 置 Fill Color (填充 色 ) 为 共 FF3300， 填 充 如 图 20-7 所 示 的 
区 域 ， 设 置 Fill Color 为 #D22B00， 填 充 红心 的 背光 部 分 ， 最 后 将 曲线 删除 (图 20-8) 


锡 各 


图 20-7 填充 区 域 图 20-8 删除 曲线 


Step 5 ”使 用 同样 的 方法 绘制 出 红心 的 高 光 部 分 ， 如 图 20-9 所 示 。 
Step6 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 并 命名 为 “礼物 。 使 用 “ . ”工具 在 场 
景 中 绘制 出 如 图 20-10 所 示 的 图 形 。 


” 是， 


图 20-9 绘制 高 光 图 20-10 绘制 图 形 


Step 7 ”使 用 恶 工具 对 图 形 进 行 填 充 ， 
最 后 效果 如 图 20-11 所 示 。 


图 20-11 填充 效果 


20.2 ”制作 按钮 的 动态 效果 


Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 并 命名 为 “鼠标 经 过 ” (图 20-12)。 然 
后 将 Library 中 的 “礼物 ”元 件 拖 入 到 场景 中 ， 并 使 用 总 工具 将 图 形 向 左旋 转 (图 20-13) 。 


义 


ta [Ce 

Behavior: 人 Cancel | 
广 Button. 

肯 =w Aavaneea | zan | 


图 20-12 新 建 Symbol 图 20-13 将 图 形 向 左旋 转 


Step 2 按 F6 键 在 第 2 帧 上 插入 一 个 关键 帧 ， 使 用 吾 工 具 将 图 形 向 右 旋转 。 按 下 Enter 
键 预览 Timeline， 使 它 形 成 左右 摇摆 的 动态 效果 ， 如 图 20-14 所 示 。 


扩 厅 下 只 ON 
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图 20-14 动态 效果 


Step 3 按 Ctrl+F8 组 合 键 创建 一 个 Symbol 并 命名 为 “按钮 ， 设 置 如 图 20-15 所 示 ， 
然后 将 Library 中 的 “礼物 ”元 件 拖 入 到 Up 影 帧 中 (图 20-16) 。 


Create New Symbol _ 基 
tc 
Behavior: 人 Wovie Clip Cancel | 


全 Button 
人 矿 Graphic 


图 20-15 新 建 Symbol 图 20-16 Up 影 帧 


Step 4 按 F6 键 在 Over 影 帧 上 插入 一 个 关键 帧 ， 将 Library 中 的 “鼠标 经 过 ”元 件 拖 
入 至 场景 中 ， 然 后 按 下 鲁 洋 葱 皮 按 钮 ， 对 照 前 一 帧 将 图 形 移动 到 合适 的 位 置 ， 如 图 20-17 所 
示 。 


Step 5 按 F7 键 在 Down 影 帧 上 插入 一 个 空白 关键 帧 (图 19-18) 。 


图 20-17 Over 影 帧 图 20-18 插入 空白 关键 帧 


Step 6 在 Hit 影 帧 上 插入 一 个 关键 帧 。 使 用 口 工具 绘制 一 个 能 完全 覆盖 礼物 图 形 的 
和 矩形 作为 按钮 的 反映 区 域 ， 如 图 20-19 所 示 。 


四 多 敬 国 
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第 3 篇 有 有声有色 久 


图 20-19 绘制 反应 区 域 


20.3 制作 礼盒 的 动态 效果 


Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 并 命名 为 “礼物 打开 `。 使 用 /“ 工具 在 场 
景 中 绘制 出 礼盒 的 外 轮廓 并 用 工具 将 直线 调整 为 曲线 (图 20-20) 。 
Step 2 ”使 用 & 工 具 对 图 形 进 行 填充 ， 最 后 的 效果 如 图 20-21 所 示 。 


图 20-20 调整 为 曲线 图 20-21 填充 色彩 


Step 3 新建 一 个 图 层 并 命名 为 “ 红 
心 ,将 Library 中 与 之 相对 应 的 元 件 拖 入 到 场 
景 中 ， 然 后 使 用 到 工具 将 图 形 缩小 (图 20-- 
2 


图 20-22 将 图 形 缩小 
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Step 4 按 F5 键 将 所 有 图 层 的 时 间 轴 都 延 
长 至 第 71 帧 。 在 “红心 ”图 层 的 第 2 帧 上 插入 一 
个 关键 帧 ， 使 用 只 工 具 将 图 形 放 大 至 整个 场景 ， 
如 图 20-23 所 示 。 


图 20-23 放大 至 整个 场景 


Step 5 ” 按 F6 键 在 第 14 帧 上 插入 关键 帧 ， 使 人 
用 到 工具 将 图 形 适 当 缩小 并 移动 至 图 20-24 所 示 的 


位 置 。 


图 20-24 移动 图 形 
Step 6 在 第 22、 第 28、 第 38、 第 47 和 第 51 帧 上 分 别 插入 关键 帧 ， 适 当地 调整 各 


关键 帧 内 图 形 的 位 置 和 大 小 (图 20-25 一 图 20-29)。 


辣 2) 


图 20-25 第 22 帧 的 效果 图 20-26 第 28 帧 的 效果 图 20-27 第 38 帧 的 效果 


四 四 钊 加 
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图 20-28 第 47 帧 的 效果 图 20-29 第 51 帧 的 效果 


Step 7 ”将 所 有 的 关键 帧 生成 Motion Tween 动画 ， 如 图 20-30 所 示 。 


Timeline 


到 可 拓 呈 [1 Tiz0ps | 60s 
图 20-30 生成 Motion Tween 动画 


Step 8 新建 一 个 图 层 并 命名 为 “弹簧 *， 在 第 9 帧 上 插入 一 个 关键 帧 ， 使 用 多 工具 给 
制 出 如 图 20-31 所 示 的 图 形 。 

Step 9 ”使 用 同样 的 方法 制作 出 弹簧 的 动态 效果 (图 20-32)，Timeline 结构 如 图 20- 
33 所 示 。 


图 20-31 绘制 图 形 图 20-32 动态 效果 


图 20-33 Timeline 结构 


Step 10 新建 一 个 图 层 并 命名 为 “光芒 ， 在 第 
2 帧 上 插入 一 个 关键 帧 ， 使 用 口 工具 绘制 一 个 与 场景 
同样 大 小 的 白色 矩形。 然后 在 第 20 帧 上 插入 一 个 关键 
帧 并 生成 Motion Tween 动画 (图 20-34) 。 


EPE 
图 20-34 生成 Motion Tween 动画 
Step 11_5 选 择 第 2 帧 中 的 矩形 ， 在 Properties 面板 中 按 图 20-35 所 示 进 行 设 置 。 选 择 

第 20 帧 中 的 矩形 ， 在 Properties 面板 中 设置 Alpha (透明 度 ) 为 0， 如 图 20-36 所 示 。 


图 20-35 ” Properties 面板 20-36 设置 Alpha 


Step 12 新建 一 个 图 层 并 命名 为 “文字 ”， 在 第 
46 帧 上 插入 一 个 关键 帧 , 使 用 同样 的 方法 制作 出 文字 
的 透明 渐变 动画 ， 如 图 20-37 所 示 。 
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图 20-37 文字 的 透明 渐变 动画 


Step 13” 单 击 “ 文 字 ” 图 层 的 第 71 帧 ， 在 Actions 面板 中 双击 stop 命令 (图 20-38) ， 
最 后 Timeline 结构 如 图 20-39 所 示 。 


| 图 Actions for Frame 71 of Layer Name 文 衬 


图 20-38 在 Actions 面板 中 双击 stop 命令 图 20-39 Timeline 结构 


20.4 合成 影片 


Step 1 按 EEBERS 回 到 主场 景 ， 将 Library 中 的 “按钮 "元件 拖 入 场景 中 (图 20-40) ， 
然后 单 击 第 1 帧 ， 在 Actions 面板 中 双击 stop 命令 (图 20-41)。 


图 20-40 拖 入 场景 中 图 20-41 在 Actions 面板 中 双击 stop 命令 
Step 2 在 第 5 帧 上 插入 一 个 关键 帧 并 按 Del 键 删除 原来 的 图 形 。 然 后 将 Library 中 “ 礼 


物 打 开 ” 元 件 拖 入 场景 中 , 按 下 旬 洋 葱 皮 按钮 , 对 照 前 一 帧 将 图 形 移动 到 相同 的 位 置 , 如 图 
20--42 所 示 。 
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人 人 二 节日 的 礼物 


图 20-42 移动 到 相同 的 位 置 


Step 3 单 击 第 5 帧 ， 在 Properties 面板 中 定义 Frame Label 为 “打开 *， 如 图 20-43 所 
示 ， 然 后 在 Actions 面板 中 为 其 加 入 stop 命令 。 


人 本 


No sound selected 


图 20-43 定义 Frame Label 


Step 4 单 击 第 1 帧 ,选择 “按钮 ”元 件 ， 在 Actions 面板 中 双击 goto 命令 ， 按 图 20- 
44 所 示 进 行 设置 。 


| 全 Achiors for [No inalance name assigned] ( 技 包 ) 


图 20-44 在 Actions 面板 中 设置 参数 


包含 较 多 图 层 


所 有 的 制作 完成 后 ， 选 择 File | Export Movie 命令 输出 成 .Swf 格式 的 文件 ， 这 样 一 个 
完整 的 动画 就 制作 完成 了 (图 20-45)。 


并 芋 千 九 章 节日 的 状 物 


图 20-45 最 终 效果 


20.5 小结 


通过 本 章 的 学 习 ， 我们 基本 掌握 了 制作 Flash 电子 贺卡 的 步骤 ,同时 也 深入 地 学 习 了 各 
种 绘图 技巧 以 及 交互 按钮 在 Flash 动 画 中 的 应 用 .相信 大 家 应 该 对 Flash 贺 卡 有 了 一 定 的 了 解 。 
其 实 制作 Flash 贺卡 与 制作 网 络 动画 、 个 性 主页 和 演示 动画 的 原理 都 是 一 样 的 ， 关 键 在 于 对 
软件 操作 的 熟练 程度 以 及 精彩 的 创意 ， 有 了 这 些 基 础 ， 好 的 作品 就 会 在 你 手中 诞生 。 


ERIEES] 


三 


学 习 利用 Actions 来 控制 背景 音乐 的 开关 


如 何 设置 可 循环 播放 的 声音 文件 
深入 了 解 如 何 设 定 动画 场景 中 的 音效 


如 何 将 交互 按钮 应 用 到 Flash 动 画 中 


我 们 经 常 能 在 一 些 Flash 网 页 中 看 到 这 种 背景 音乐 的 开关 ， 当 按 下 按钮 后 ， 音 乐 就 停止 
播放 ， 再 次 按 下 按钮 ， 又 会 继续 播放 背景 音乐 ， 如 图 21-1 和 图 21--2 所 示 。 


叫 X 邮 Macromedia Flash PlayerE 
7 一 一 


图 21_1 成 品 效 果 之 一 图 21_2 ”成 品 兢 村 之 二 


操作 步骤 
21.1 制作 背景 以 及 按钮 元 素 


Step 1 新 建 一 个 文档 ， 在 Properties 面板 中 设置 Size 为 300 x 300Pixels， Background 
设 定 为 共 999999 (图 21-3) . 


A Documem she 300300pheks_ | Backgoumt 攻 | FrameRaes [2 ”fps 


幕 二 十 覃 2- | Pubisk Plash Player 6 


图 21-3 Properties 面板 


Step 2 ”使 用 口 工具 绘制 一 个 与 场景 同样 大 小 的 矩形 ， Fill Color 设 定 为 共 9999FF ,如 
图 21 一 4 所 示 。 

Step 3 ” 单 击 Y 工 具 , 设置 Fill Color 为 共 97FF51， 在 场景 中 随意 绘制 一 个 图 形 ， 如 图 
21 一 5 所 示 。 


图 21-4 绘制 矩形 图 21-5 绘制 图 形 


Step 4 ”使 用 国 工 具 将 新 绘制 的 图 形 向 左 移动 ， 以 便 露 出 背景 的 底 色 (图 21-6)。 
Step 5 ”再 将 图 形 向 右 稍微 移动 一 些 ， 最 后 效果 如 图 21--7 所 示 。 


图 21-6 露出 背景 的 底 色 图 21-7 背景 效果 


Step 6 ”新 建 一 个 图 层 并 命名 为 “文字 ”， 使 用 A 工 具 在 场景 中 输入 “Sound Button 
字样 (图 21-8)。 

Step 7 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol 并 命名 为 “按钮 ，Behavior 设置 为 Button 
(图 21-9)。 


Create New Symbol 人 | 


.ic CE 
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本 1 3 了 Cancel | 
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图 21-8 输入 文字 图 21-9 新 建 Symbol 


Step 8 单 击 2 工具 ,在 Properties 面板 中 按 图 21-10 所 示 进 行 设置 ， 然 后 在 场景 中 绘 
制 一 个 无 填充 色 的 圆 形 并 使 用 ” 工具 继续 绘制 出 如 图 21-11 所 示 的 图 形 。 


TY Properties 


图 21-10 Properties 面板 图 20-11 绘制 图 形 


Step 9 在 Over 和 Down 影 帧 上 分 别 插入 关键 帧 ， 单 击 Over 影 帧 ， 调 整 图 形 的 填充 色 
为 并 CCCCFF (图 21-12) 。 


图 21-12 调整 填充 色 


四 四 鸭 国 
经 典 作 品 解 析 | 人 从 


Step 10 ” 单 击 Down 影 帧 ， 打 开 Transform 面板 ， 按 图 21-13 所 示 进 行 设置 。 然 后 使 
用 o 工具 在 Hit 影 帧 中 绘制 按钮 的 反应 区 域 (图 21-14)。 


Transform 


图 21-13 Transform 面板 图 21-14 绘制 反应 区 域 


21.2 制作 背景 音乐 开关 


Step1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 并 命名 为 “控制 ”，Behavior 设置 为 Movie 
Cl 访 (图 对 一 15) 。 


Create New Symbol 
3 AT 


图 21-15 新 建 Symbol 


Step 2 双击 Layer 1 改名 为 “Actions”， 定 义 第 1 帧 的 Frame Label 为 “Play” (图 21-- 
16)。 在 第 20 帧 上 插入 一 个 关键 帧 ， 定 义 Frame Label 为 “Stop” ， 如 图 21-17 所 示 。 


Timeline 


[ 


图 21-16 定义 Frame Label 图 21-17 定义 Frame Label 


Step 3 ”新 建 一 个 图 层 ， 按 Ctrl+L 组 合 键 打开 Library， 将 -按钮 元件 托 入 场景 中 ， 
然后 在 第 20 帧 上 插入 一 个 关键 帧 (图 21-18)。 刘 
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图 21-18 插入 关键 帧 


Step 4 单 击 第 1 帧 中 的 “按钮 元件， 在 Actions 面板 中 双击 goto 命令 ， 按 图 21 一 
19 所 示 进 行 设置 。 


AcCtions - Button 
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图 21-19 Actions 面板 


Step 5 单 击 第 20 帧 中 的 “按钮 元件， 在 Actions 面板 中 按 图 21-20 所 示 进 行 设 置 。 


TY Actions - Button 
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图 21-20 Actions 面板 


Step 6 新 建 一 个 图 层 ， 在 第 20 帧 上 插入 一 个 关键 帧 ， 使 用 过 工具 绘制 一 条 斜 线 ， 如 
21 一 21 所 示 。 


图 21-21 绘制 斜 线 
Step 7 新建 一 个 图 层 并 命名 为 “声音 ,选择 File | Import 命令 ， 在 附 赠 的 光盘 中 找 
到 素材 / 声音 . Way 文件。 然后 在 Properties 面板 中 设置 Sync (同步 音效 ) 为 Start (开始 ) ， 
Loop (循环 次 数 ) 为 1000 (图 21-22)。 


ww Properties 


21-22 Properties 面板 


Step 8 在 当前 层 的 第 20 帧 上 插入 一 个 关键 帧 ， 设 置 Sync (同步 音效 ) 为 Stop ( 停 
止 )， 如 图 21-23 所 示 ，Timeline 结构 如 图 21 一 24 所 示 。 


v properties 


Frame 
FFrame Label 
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图 21-23 设置 Sync (同步 音效 ) 图 21-24 Timeline 结构 


Step 9 ” 近 EEE 按 钮 回 到 主场 景 ， 将 Library 中 
的 “控制 ”元 件 放置 在 合适 的 位 置 (图 21-25)。 

按 下 Ctrl+Enter 组 合 键 进行 预览 , 测试 一 下 场景 中 的 
按钮 是 否 起 作用 , 当 一 切 都 满意 后 ,选择 菜单 File | Export 
Movie 输出 成 .swf 格式 的 文件 。 


21.3 小 结 


制作 一 个 背景 音乐 开关 的 关键 在 于 要 将 两 个 同样 的 
按钮 放置 在 不 同 的 影 帧 中 , 然后 利用 按钮 的 Actions 来 切 
换 这 两 个 影 帧 .第 一 个 影 帧 里 放置 背景 音效 ,并 设 定 Sync 
(同步 音效 ) 为 Start (开始 ) , 第 二 个 影 帧 则 设 定 Sync ( 同 人 
步 音效 ) 为 Stop (停止 ) 。 


本 章 重点 


掌握 涟 游 特效 的 制作 方法 与 过 程 


《人 园 通过 各 种 技巧 创作 出 精彩 的 视觉 效果 


@ 侈 Mask ( 遮 章 ) 与 Shape 变形 动画 相 结 合 的 动画 制作 技巧 


本 章 通过 运用 Mask ( 遮 罩 ) 与 Shape 变形 动画 相 结合 的 方法 制作 出 动态 的 涟 游 效果 ,如 
图 22 一 1 和 图 22--2 所 示 。 
romedin rhosh PlayaE | 
| 文 fKE) 查 着 (Y) 控 币 G) 如 动 


图 22-1 成 品 效果 之 一 图 22-2 ”成 唱 效 果 之 二 


22.1 制作 动画 的 基本 背景 


Step 1 新 建 一 个 空白 文档 ， 在 Properties 面板 中 设置 Size 为 285 x 440Pixels， 其 他 
设置 保持 默认 (图 22 一 3) 。 


办 四 划 国 
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Properties 


AL ws. 


Publish: Flash Player6 


spe “28665540pials | 。 Background | Famepate 站 2 fps 


22-3 在 Properties 面板 中 设置 参数 


Step 2 ”双击 Layer 1 并 改名 为 “ 底 图 ， 选 择 File | 
Import 命 令 , 在 附 赠 的 光盘 中 找到 素材 | 涟 游 .jpg 文 件 , 将 此 
图 移动 至 合适 的 位 置 (图 22 一 4) 。 


Step 3 按 Ctrl+C 组 合 键 将 图 片 进行 复制 ,然后 新 建 一 
个 图 层 并 命名 为 “大 图 ， 将 图 片 粘贴 在 当前 图 层 中 。 打 开 
Transform 面 板 ， 按 图 22--5 所 示 进 行 设置 , 最 后 效果 如 图 22 一 
6 所 示 。 


v Transform 


图 22-5 在 Transform 面板 中 图 22-6 粘贴 图 片 
设置 参数 


22.2 ”制作 涟 游 动态 效果 


Step 1 新 建 一 个 图 层 并 命名 为 “ 涟 洲 ， 使 用 D 工具 在 场景 中 随意 绘制 一 些 椭圆 (图 
22 一 让。 


图 22-7 绘制 贺 


Step 2 ”在 第 40 帧 上 插入 一 个 关键 帧 ， 使 用 o 工具 继续 绘制 { 图 22-8)， 然 后 按 F5 
键 将 所 有 图 晨 的 时 间 轴 都 延长 至 第 40 帧 ， 如 图 22--9 所 示 。 


图 22-8 继续 绘制 查 贺 图 22-9 延长 时 间 轴 


Step 3 单 击 第 1 帧 ， 在 Properties 面板 中 设置 Tween (动画 方式 ) 为 Shape 变形 动画 
(图 22--10)， 最 后 结果 如 图 22--11 和 图 22--12 所 示 。 


m Properties 


Frame 
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图 22-10 在 Properties 面板 中 设置 参数 


改 等 尝 民 
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Step 1 新 建 一 个 图 层 并 命名 为 “外 框 " ， 单 击 口 工具 ， 设 置 Fill Color 为 共 FFFFFF ， 
然后 在 场景 中 绘制 一 个 和 场景 同样 大 小 的 矩形 (图 22-15)。 

Step 2 ”继续 使 用 口 工具 ， 在 Options 项 中 单 击 Round Rectangle Radius ( 导 角 ) 按钮 ， 
在 弹出 的 Rectangle Settings 面板 中 按 图 22 一 16 所 示 进 行 设置 。 然 后 更 换 一 种 填充 色 并 在 场 


景 中 绘制 出 如 图 22-17 所 示 珑 形 。 
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图 22-15 ” 健 制 外 框 图 22-16 Rectangle Settings 面板 图 22-17 继续 绘制 矩形 
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Step 3 ” 按 Del 键 将 新 绘制 的 图 形 删除 ， 得 到 如 图 22-18 所 示 的 外 框 。 
Step 4 使 用 * 工具 对 外 框 进行 深入 调整 ， 最 后 效果 如 图 22--19 所 示 。 


图 22-18 删除 图 形 图 22-19 调整 曲线 


二 NA 


所 有 的 制作 完成 后 ， 选 择 File | Export Movie 输出 成 .Swf 格式 的 文件 。 


办 外 葛 国 
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22.4 小结 


通过 本 章 的 学 习 , 我 们 已 经 掌握 了 制作 水 面 涟 游 特效 的 方法 与 思路 .。 可 以 看 出 , 在 这 个 
非常 精彩 的 Flash 特效 动画 中 其 实 并 没有 太 多 的 技术 成 份 , 它 是 完全 在 最 基本 的 动画 效果 上 
演变 而 来 的 。 所 以 我 们 在 学 习 和 创作 flash 动画 的 过 程 中 , 一定 要 先 熟练 掌握 所 学 过 的 基础 
知识 并 不 断 地 在 此 基础 上 进行 创造 ， 只 有 这 样 才能 做 出 同样 精彩 的 Flash 动画 。 
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亲爱 的 ， 能 原谅 我 吗 ? 


利用 渐变 填充 模拟 真实 的 透明 效果 
气泡 图 形 的 绘制 方法 与 制作 过 程 
如 何 制 作 永 远 也 按 不 到 的 按钮 


通过 对 按钮 的 设置 制作 出 有 趣 的 动画 效果 


这 是 一 个 非常 有 趣 的 Flash 动画 ， 曾 经 在 互联 网 上 风靡 一 时 。 试 试看 ， 你 能 拒绝 我 吗 ? 
如 图 23-1 和 图 23 一 2 所 示 。 


图 23-1 成品 效 果 之 一 图 23-2 成品 效 果 之 二 


操作 步骤 
23.1 动画 背景 的 制作 


Step 1 新 建 一 个 空白 文档 ， 在 Properties 面板 中 设置 Size 为 550 x 400Pixels，Back 一 
ground 设 定 为 共 FF667D (图 23-3) 


典 作品 解析 | 从 
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23-3 在 Properties 面板 中 设置 参数 


Step 2 双击 Layer 1 并 改名 为 “文字 ， 使 用 A 工 具 在 场景 中 输入 一 些 文字 (图 23 一 4) 。 


图 23-4 输入 文字 


Step 3 按 Ctrl+F8 组 合 键 创建 一 个 Symbol， 按 图 23-5 所 示 进 行 设置 。 使 用 o 工具 在 
场景 中 绘制 一 个 无 填充 色 的 圆 形 (图 23-6) 。 


图 23-5 新 建 Symbol 图 23-6 绘制 圆 形 


Step 4 单 击 及 工具 ， 在 Color Mixer 面板 中 设置 填充 方式 为 Radial， 并 设 定 第 一 个 色 
标 为 背景 色 , 第 二 个 色 标 为 白色 ,然后 移动 滑 块 到 中 间 位 置 (图 23-7), 填充 后 的 效果 如 图 
23-8 所 示 。 
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图 23-7 在 Color Mixer 面 图 23-8 填充 效果 


板 中 设置 参数 
Step 5 ” 按 Del 键 将 圆 形 的 外 轮廓 删除 ， 使 用 时 工 具 对 填充 色 进行 调整 ， 如 图 23-9 所 


示 


Step 6 ”使 用 多 工具 画 上 气泡 的 高 光 点 ， 注 意 要 根据 球体 的 结构 布置 ， 这 样 才能 让 最 
终 效果 看 起 来 更 加 透明 和 立体 (图 23-10)。 


图 23-9 调整 填充 色 图 23-10 绘制 高 光 


Step 7 按 Ctrl+F8 组 合 键 创 建 一 个 Symbol 并 命名 为 “气泡 动画 ”， 设 置 Behavior 为 
Movie Clip (图 23-11)。 然 后 利用 Motion Tween 动画 方式 制作 出 一 段 气泡 上 升 的 动画 ， 并 
适当 调整 一 下 气泡 在 运动 过 程 中 的 透明 度 、 位 置 和 大 小 ， 如 图 23-12 和 图 23-13 所 示 。 
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图 23-11 新 建 Symbol 
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23-12 Motion Tween 动画 图 23-13 ”Motion Tween 动画 


Step 8 ” 按 有 ES 加 到 主场 景 ， 新 建 一 个 图 层 并 命名 为 “气泡 ， 然 后 将 刚 做 好 的 气 
泡 动画 导入 场景 中 ， 如 图 23-14 所 示 。 

Step 9 重复 导入 气泡 动画 ， 使 用 豆 工 具 适 当 调整 一 下 气泡 运动 的 角度 ， 如 图 23 一 15 
所 示 。 


图 23-14 导入 动画 图 22-15 调整 气泡 运动 的 角度 


23.2 ”永远 按 不 到 的 按钮 


Step 1 按 Ctrl+F8 组 合 键 创 建 一 个 Symbol ,并 命名 为 “同意 ”, 设置 Behavior 为 Graphic 
(图 23-16) ， 然 后 在 场景 中 绘制 出 图 23-17 所 示 的 按钮 图 形 。 


能 原谅 我 吗 
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图 23-16 创建 Symbol 图 23-17 绘制 按钮 图 形 


Step 2 ”继续 创建 一 个 Symbol， 并 命名 为 “同意 -按钮 ”， 设 置 Behavior 为 Button ( 按 
钮 )。 打 开 Library， 将 刚刚 绘制 的 按钮 图 形 拖 入 Up 影 帧 中 ， 如 图 23 一 18 所 示 。 

Step 3 按 F6 键 在 Over 影 帧 上 插入 一 个 关键 帧 ， 使 用 站 工具 将 图 形 进行 等 比 缩小 (图 
23--19) 。 


Timeline 
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图 23-18 Up 影 帧 图 23-19 等 比 缩小 


Step 4 在 Hit 影 帧 上 插入 一 个 关键 帧 ， 然 后 将 原 图 形 删 除 。 单 击 Timline 中 的 鱼 按 钮 ， 
使 用 互 工具 绘制 一 个 矩形 作为 鼠标 的 反应 范围 ， 如 图 23 一 20 所 示 。 
Step 5 ”使 用 同样 的 方法 制作 出 第 二 个 按钮 ， 如 图 23 一 21 所 示 。 


Timekline 


Timeline 


图 23-20 绘制 鼠标 的 反应 范围 图 23-21 制作 第 二 个 按钮 
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23.3 合成 动画 


Step 1 按 民 EE 靖 加 到 主场 景 ， 新 建 一 个 图 层 并 命名 为 “按钮 ，， 将 Library 中 的 两 个 
按钮 元 件 拖 入 场景 中 ， 如 图 23 一 23 所 示 。 


图 23-23 拖 入 按钮 
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Step 2 ”新 建 一 个 图 层 并 命名 为 “结束 语 ， 在 第 2 帧 上 插入 一 个 关键 帧 ， 然 后 利用 
Mask ( 遮 罩 ) 制作 出 一 段 文字 动画 ， 如 图 23 一 24 所 示 。 


Step 3 单 击 “按钮 ”图 层 中 的 “同意 ”按钮 ， 在 Actions 面板 中 双击 on 命令 ， 确 定 
勾 选 release， 双 击 goto 命令 并 在 Frame 后 面 的 对 话 框 中 输入 2， 如 图 23-25 所 示 。 
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图 23-25 在 Actions 面板 中 设置 参数 


所 有 的 制作 都 完成 了 , 按 下 Ctrl+Enter 组 合 键 进行 预览 并 测试 按钮 的 交互 性 ， 如 确定 没 
有 问题 后 选择 File | Export Movie 命令 输出 成 .Swf 格式 文件 。 


23.4 小 结 


学 习 过 本 章 的 Flash 教 程 后 , 是 否 给 你 带 来 了 一 些 创 作 上 的 灵感 呢 ; 也 许 有 些 朋 友 当 初 
就 是 看 过 这 类 的 Flash 动 画 才 萌发 立志 成 为 内 客 的 念头 吧 ” 其实 制 作 精 彩 的 Flash 动 画 并 不 难 ， 
难 的 是 如 何 能 充分 利用 所 学 的 知识 进行 发 明和 创作 ! 有 些 人 在 技术 上 可 能 已 经 非常 精通 ,但 
是 却 怎么 也 做 不 出 好 的 作品 来 . 最 后 只 成 为 了 一 个 Flash 的 技术 操作 员 ,， 所 以 我 们 一 定 要 在 
学 习 的 过 程 中 充分 发 挥 想 像 力 与 创造 力 。 请 记 住 : 下 一 个 精彩 的 Flash 作 品 的 作者 将 会 是 你 ， 


四 四 轴 国 


第 24 章 [SEE 


部 练 掌握 绘制 矢量 图 形 的 方法 与 技巧 


将 复杂 的 图 形 分 解 成 多 个 Symbol 从 而 提高 工作 效率 
如 何 设置 循环 影片 片段 与 动态 控制 区 域 
通过 Actions 制 作出 动态 的 交互 效果 


利用 键盘 上 的 按键 来 控制 对 象 的 动作 行为 


在 本 章 的 实例 中 ,我们 可 以 通过 键盘 上 的 方向 键 来 展示 赤 免 马 的 功夫 , 它 可 是 会 向 你 挑 
鲜 的 呀 ,如 图 24--1 和 图 24--2 所 示 。 


图 24-1 成品 效果 之 一 


24.1 赤 免 马 的 绘制 过 程 


Step 1 启动 Flash MX， 新 建文 档 。 在 Properties 面板 中 设置 Size 为 550 x 400Pixels ， 
其 他 参数 保持 默认 (图 24-3) 。 


ESEE 


第 二 十 三 重 - | Puaisk Flash Player 6 


图 24-3 在 Properties 面板 中 设置 参数 


二 FramePFakte | fps 


Step 2 ” 按 Ctrl+F8 组 合 键 创建 一 个 Symbol， 按 图 24-4 所 示 进 行 设 置 。 单 击 “工具 ， 
将 Options 面板 中 的 Pencil Mode 设置 为 Smooth (光滑 ) 方式 ， 然 后 在 场景 中 绘制 出 赤 免 马 


的 外 轮廓 (图 24--5)。 


Behavior: 人 广 Wovie Clipy 
三 Button 
G ER 


24-4 创建 一 个 Symbol 


图 24-5 绘制 轮廓 


Step 3 ”如 果 想 得 到 更 加 圆滑 的 曲线 ， 可 以 使 用 * 工具 对 局 部 曲线 进行 深入 调整 ， 同 


时 要 注意 让 图 形成 封闭 的 空间 以 便 填 充 颜 色 (图 24-6) 。 


Step 4 单 击 砚 工 具 ， 设 置 颜色 为 #993300， 对 赤 免 马 的 身体 进行 填充 ， 其 他 部 分 使 


用 自己 喜欢 的 色彩 即 可 ， 如 图 24--7 所 示 。 


图 24-6 让 图 形成 封闭 的 空间 
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WE ooFxsl 


Step 5 ”使 用 过 . 丽 等 工具 完成 局 部 细节 的 绘制 ， 如 图 24--8 和 图 24-9 所 示 ， 至 此 ， 
本 章 的 主角 就 诞生 了 (图 24--10)。 


图 24-8 局 部 细节 图 24-9 局 部 细节 图 24-10 完成 效果 


的 某 些 局 邵 转化 为 Symbol ， 这 样 在 最 后 制作 动画 时 就 可 以 


图 24-11 完成 效果 


24.2 ” 主 循环 影片 的 制作 


Step 1 按 Ctrl+F8 组 合 键 创 建 一 个 Symbol 并 命名 为 “控制 ”， 设 置 Behavior 为 Movie 
clip 方式 (图 24-12)。 然 后 将 刚刚 绘制 的 赤 免 马 图 形 拖 入 到 场景 中 ， 如 图 24--13 所 示 。 

Step 2 在 第 10 一 第 13 帧 上 分 别 插入 关键 帧 ， 然 后 使 用 * 工具 对 第 10 和 第 12 帧 中 赤 
免 马 的 位 置 进行 一 定 的 调整 ， 以 便 形 成 生动 自然 的 动态 效果 (图 24-14)。 
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ie 


Behavior: 人 Wovie [Clip Cancel | 
人 矿 Button 
人 六 Graphi 
Aayanced | ze | 


Timejline 


图 24-13 拖 入 场景 图 24-14“ 调 整 位 置 


Step 3 在 第 30、 第 32、 第 34 和 第 36 帧 上 分 别 插入 关键 帧 (图 24--15)。 在 第 30 和 
第 34 帧 上 分 别 按 Ctrl+T 组 合 键 打开 Transform 面板 ， 按 图 24--16 所 示 进 行 设 置 ， 效 果 如 图 
24 一 17 所 示 。 

Step 4 “新建 一 个 图 层 并 命名 为 “阴影 ”， 使 用 G 工具 在 赤 免 马 的 下 面 绘制 一 个 椭圆 
作为 阴影 (图 24-18) 。 


Transform 


| 100.o% 4 100.0% 


JI constrain 


六 Rotate 本 
人 SeW 1 0,.0。 | 180.05 | 
| 


图 24-16 Transform 面板 


打 


Timeline 


有 人 1 天 的 未 多 己 | 


图 24-17 预览 效果 图 24-18 绘制 阴影 


Step 5 ”一 部 精彩 的 动画 只 有 图 像 是 不 够 的 ， 还 需要 再 配合 一 些 动态 的 文字 才能 起 到 
丰富 画面 的 作用 ， 如 图 24--19 和 图 24 一 20 所 示 。 


图 24-19 制作 动态 文字 图 24-20 制作 动态 文字 


Step 6 新 建 Actions 图 层 ， 按 F6 键 在 第 64 帧 上 插入 一 个 关键 帧 ， 然 后 打开 Ac-- 
tions 面板 ， 双 击 goto 命令 并 在 Frame 后面 的 对 话 框 中 输入 1 (图 24-21)， 最 后 Timeline 结构 
如 图 24--22 所 示 。 


四 押 绅 加 
h MX 经 典 作 辟 


Ar 


宙 ” 慰 


图 24-21 在 Actions 面板 中 设置 参数 图 24-22 Timeline 结构 


24.3 ”动态 控制 区 域 的 制作 


Step 1 单 击 “ 赤 免 马 ”图 层 ， 在 第 65 帧 上 插入 一 个 关键 帧 ， 按 CtrlI+B 组合 键 将 图 
形 打 散 并 使 用 又. 商 等 工具 对 图 形 进行 修改 (图 24-23)， 然 后 在 Properties 面板 中 定义 Frame 
Label 为 “上 ， 如 图 24 一 24 所 示 。 


T Properties 


图 24-23 修改 图 形 图 24-24 定义 Frame Label 


Step 2 单 击 “Actions” 图 层 ， 在 第 68 帧 上 插入 一 个 关键 帧 并 在 Actions 面板 中 按 图 
24--25 所 示 进 行 设置 ， 最 后 Timeline 结构 如 图 24--26 所 示 。 


图 Acuons or Frame 68 of Layer Neme acton 


和 GoioandPm 和 GotoindSop 


图 24-25 在 Actions 面板 中 设置 参数 图 24-26 Timeline 结构 


196 


会 功夫 的 赤 免 马 


Step 3 回 到 “ 赤 免 马 图 层 ， 在 第 70 帧 上 插入 一 个 关键 帧 ， 继 续 使 用 7 .& 等 工具 
对 图 形 进 行 修改 ， 这 时 我 们 就 可 以 很 方便 地 套用 原先 制作 好 的 局 部 Symbol 了 (图 24 一 27) ， 
最 后 在 Properties 面板 中 定义 Frame Label 为 “下 。 


library - 第 二 十 三 章 会 


图 24-27 套用 Symbol 


Step 4 单 击 “Actions” 图 层 ， 在 第 73 帧 上 插入 一 个 关键 帧 并 在 Actions 面板 中 双击 
goto 命令 ， 最 后 Timeline 结构 如 图 24--28 所 示 。 


Step 5 ”使 用 相同 的 方法 继续 制作 出 
左 和 右 的 状态 ,预览 效果 如 图 24--29 
所 示 。 


图 24-29 预览 效果 


hMx 经 站 作品 解析 | 从 


有 志 有 色 的 Flash 篇 


赤 免 马 的 “ 右 ” 状 态 可 以 通过 对 “ 左 ” 状 态 进 行 水 平 镜像 来 完成 ， 如 图 24 一 30 所 示 ， 这样 可 以 
大 幅度 地 提 富 


Transform 


Er 


7 constrain 


CRaae 4 一 


图 24-30 水 平 镜 像 


24.4 合成 影片 


Step 1 。 按 EE 回 到 主场 景 ， 使 用 双 . 瓦 等 
工具 在 场景 中 绘制 出 背景 图 形 ， 过 程 如 图 24 一 
31 一 图 24-33 所 示 。 


图 24-31 绘制 背景 图 形 (一 ) 


图 24-32 绘制 背景 图 形 (二 ) 图 24-33 绘制 背景 图 形 ( 三) 
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向 键 可 以 按 制 它 叶 | 
24-34 将 元 件 拖 入 场 最 


Step 3 单 击 刚刚 导入 的 赤 免 马 图 形 ， 在 Action 面板 中 双击 on 命令 ， 勾 选 Key Press 
后 按 Up 方向 键 :( 图 24 一 35 ) 。 


| Actions for [No instance name assigned] (控制 ) 


| Line 1: on (keyPress "<Up>){ 
24-35 按 Up 方向 键 


Step 4 双击 goto 命令 并 在 Frame 后 面 的 对 话 框 中 输入 65， 如 图 24--36 所 示 。 


| 图 Acions For [No instance name assigned] (控制 


C 6otandPlg 三 GomandSiop 
Scene | -current scene> 
Jpe Famewumew 
Frame: 碟 
相生 = 人 提 


on (keyPress “<Up> 


图 24-36 “在 Frame 后 面 的 对 话 框 中 输入 65 


方向 键 ， 就 跳 转 到 自身 影片 的 第 6 5 帧 〈 也 就 是 图 24 - 3 7 中 标记 为 


atior 本 下 中 胃 
/ ”| 了 RN 
阴影 人 
一 一 Liz0fps | na 
图 24-37 Timeline 结构 


Step 5 ”使 用 同样 的 方法 继续 制作 ， 最 后 全 部 代码 如 下 : 


on (keyPress "<UP>") { 
gotoRAndP1ay(65) ， 


} 
on (keyPress "<Down>") { 
gotoanadP1laYy(70) ， 
} 
| on (keyPress "<Left>") { 
gotoaAndPlay(75) ， 


} 
on (keyPress "<Right>") { 
gotoaRAndqPlay(80) ; 


} 
所 有 的 制作 都 完成 了 , 按 下 Ctrl+Enter 组 合 键 进行 预览 并 测试 一 下 影片 的 交互 性 ,最 后 
选择 File | Export Movie 命令 输出 成 .Swf 格式 的 文件 进行 发 布 。 


24.5 小结 
本 章 的 关键 技巧 在 于 如 何 设置 循环 影片 片段 与 动态 控制 区 域 ， 以 图 24 一 38 为 例 ， 


循环 影片 片断 
[TIEEEEEET 着 


当 不 按 下 任何 控制 键 时 ， 影 片 就 会 在 第 1 帧 与 第 64 帧 之 间 不 断 循 环 播放 ， 这 时 主 画 面 
呈现 出 的 就 是 赤 免 马 自 身 的 动态 效果 .一旦 按 下 键盘 上 的 控制 键 ,影片 就 会 迅速 跳 至 控制 区 
域 中 与 之 相对 应 的 影 帧 位 置 处 并 开始 播放 , 在 播放 了 3 帧 后 又 返回 到 主 影片 的 循环 状态 中 ， 
因此 就 构成 本 章 中 的 交互 动态 效果 了 。 


献 给 母亲 的 礼物 


熟练 掌握 Flash MX 中 各 种 绘图 工具 的 特性 
了 解 制作 复杂 动画 的 基本 流程 与 创作 思路 
运用 逐 帧 动画 方式 制作 出 真实 的 动态 效果 


利用 各 种 制作 技巧 生动 地 表现 出 动画 的 细节 


本 实例 用 鲜花 代表 了 母亲 的 形象 , 并 通过 春 、 夏 、 秋 、 冬 四 季 的 变化 以 及 在 细节 的 刻画 
上 充分 体现 出 母亲 对 孩子 的 呵护 ， 如 图 25-1 一 图 25-4 所 示 。 


图 25-1 成 品 效果 之 一 图 25-2 成 品 效 果 之 二 


内 


〔C 一 ) 


奏 
| 


图 25-3 成 品 效果 之 三 图 25-4 成 品 效果 之 四 
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办 四 井 国 
MX 经 典 作品 解析 | 耸 


操作 步骤 
25.1 绘制 动画 所 需要 的 基本 元 素 


Step 1 新建 一 个 空 自 文档 计 在 Properties 面板 中 设置 3ize 为 580 x 400Pixels， 其 他 
参数 保持 默认 (图 25-5) 。 
She 560x400| 四 FRR 
艳 一 


25-5 在 Properties 面板 中 设置 参数 


Step 2 按 Ctrl+F8 组 合 键 创建 一 个 Symbol 并 命名 为 “ 花 准 ”( 图 25-6)。 使 用 2 工具 
在 场景 中 绘制 一 个 李 圆 ， 如 图 25 一 7 所 示 。 


图 25-6 创建 Symbol 图 25-7 绘制 权 圆 


Step 3 ”使 用 国 工 具 将 椭圆 调整 为 图 25-8 所 示 的 花瓣 形状 。 
Step 4 ” 单 击 网 工具 ， 在 Color Mixer 面板 中 设置 填充 方式 为 Radial， 设 定 第 一 个 色 标 
为 #FFFFEC， 第 二 个 色 标 为 #FF99FF ， 然 后 对 图 形 进行 填充 (图 25 一 9 六 


Color Mixer 


图 25-8 调整 曲线 
Step 5 ”使 用 艺 工 具 对 图 形 的 填充 方向 进行 调整 ， 最 后 效果 如 图 25-10 所 示 。 


Step 6 新 建 一 个 Symbol， 将 Library 中 的 “花瓣 ”元 件 拖 入 场景 中 做 圆 形 阵列 ， 然 后 
在 Properties 面板 中 分 别 设置 每 片花 瓣 的 色调 (图 25-11) 。 
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本 SR 
cam 可 天 风 


i 凤 Je 
3 一 _| cosJrn 二 JIE 
下 人 [应 e se | 
N 5 SI 
| | 
,= 妆 齐 
下 
yy ER 
图 25-10 调整 填充 方向 图 25-11 设置 花瓣 的 色调 


Step 7 ”使 用 荔 . 丙 等 工具 将 图 形 绘制 完成 ， 最 后 效果 如 图 25-12 所 示 。 
Step 8 使 用 同样 的 方法 制作 出 第 二 采花 并 按 F8 键 将 其 转 为 Symbol， 如 图 25-13 所 


示 。 


图 25-12 绘制 完成 图 25-13 转 为 Symbol 


万 法 有 很 多 种 ， 只 要 掌握 了 每 种 工具 的 特性 ， 相 信 大 家 可 以 找 


25.2 ”动画 主场 景 之 一 一 一 春 


Step 1 。” 按 EE 回 到 主场 景 ， 双击 Layer 1 改名 为 “背景 " 。 单 击 & 工 具 ， 在 Color 
Mixer 面 板 中 设置 填充 方式 为 Radial, 设 定 第 一 个 色 标 为 共 FFFFEC,， 第 二 个 色 标 为 共 75C5FF ， 
然后 绘制 一 个 与 场景 相同 大 小 的 背景 图 形 (图 25-14)。 

Step 2 使 用 钻 工 具 对 图 形 的 填充 方向 进行 调整 (图 25-15)， 然 后 按 F8 键 将 其 转 为 
一 个 Symbol 。 


| 图 25-14 背景 图 形 图 25-15 对 填充 方向 进行 调整 


Step 3 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 使 用 ” .& 等 工具 在 场景 中 绘制 一 涛 浮云 
(图 25-16 ) 。 


图 25-16 绘制 浮云 


Step 4 按 EBE 到 回 到 主场 景 ， 新 建 一 个 图 层 并 命名 为 “ 云 "， 将 刚刚 绘制 的 图 形 拖 入 
场景 中 并 使 用 Motion Tween 方式 制作 一 段 浮云 际 动 的 动画 效果 ， 如 图 25-17 所 示 。 


图 25-17 生成 Motion Tween 动画 


Step 5 新 建 两 个 图 层 ， 将 Library 中 的 两 洒 鲜 花 图 形 分 别 载 入 其 中 并 制作 一 段 Motion 
Tween 动画 (图 25-18 和 图 25-19) 


图 25-18 生成 Motion Tween 动画 25-19 生成 Motion Tween 动画 


Step 6 第 60 帧 一 第 75 帧 有 一 处 细节 的 刻画 ， 花 办 有 随 着 微风 轻 轻 摇 所， 这 主要 是 通 
过 逐 帧 动画 来 实现 的 (图 25-20 和 图 25-21)。( 有 关 逐 帧 动画 的 详细 介绍 请 参见 本 书 “1.1.3 
逐 帧 动画 ”一 节 ) 
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四 四 昌 国 
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经 典 作 


图 25-20 设置 关键 帧 图 25_21 设置 关键 由 
25.3 动画 主场 景 之 二 一 一 夏 
Step 1 单 击 背景” 图 层 , 在 第 90 和 第 110 帧 上 分 别 插入 关键 帧 并 生成 Motion Tween 
动画 ， 如 图 25 一 22 所 示 。 
v Timeline 
人 


| 


2 ee | 
FT ET 


图 25-22 生成 Motion Tween 动画 


Step 2 选取 第 110 帧 中 的 背景 图 形 ， 在 Properties 面板 中 按 图 25-23 所 示 进 行 设置 ， 
最 后 效果 如 图 25-24 所 示 。 


图 25-23， 在 Properties 面板 中 设置 参数 图 25-24 预览 效 果 


Step 3 新建 一 个 图 层 并 命名 为 “闪电 和 雨 ， 在 第 111 帧 上 插入 一 个 关键 帧 并 使 用 “ 
工具 绘制 出 闪电 的 图 形 (图 25-25),， 在 其 他 图 层 与 之 相对 应 的 位 置 同样 设 置 关 键 由 并 做 适 


当 修 改 ， 最 后 形成 图 25-26 和 图 25--27 所 示 闪 电 的 效果 。 如 
果 想 追求 更 加 丰富 的 画面 效果 , 可 以 进一步 调节 各 关键 帧 中 
图 形 的 属性 ,例如 在 天 空 变 暗 的 同时 ,云彩 的 颜色 也 随 之 加 
深 并 逐渐 消失 等 等 。 


图 25-25 绘制 闪电 图 形 


图 25-26 制作 闪电 动画 效果 图 25-27 制作 闪电 动画 效果 


Step 4 在 当前 层 第 121 帧 上 插入 一 个 关键 帧 ， 使 用 Motion Tween 方式 制作 一 段 下 雨 
的 动画 效果 (图 25-28) 。 在 其 他 图 层 与 之 相对 应 的 位 置 同样 设置 关键 帧 并 做 适当 修改 ， 最 
后 形成 图 25--29 和 图 25--30 所 示 的 效果 。 


图 25-28 下 两 的 动画 效果 图 25-29 动态 效果 
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25-30 动态 效果 
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Step 5 新 建 一 个 图 层 并 命名 为 
绘制 一 个 与 场景 相同 大 小 的 遮 单 范围 
Mask 后 的 效果 如 图 25 一 32 所 示 。 


图 25-31 控 除 非 遮 罩 范围 


25.4 动画 主场 景 之 三 一 一 秋 


Step 1 按 Ctrl+F8 键 创 建 一 个 Symbol ， 


33 所 示 进 行 设置 。 


“ 遮 普 ， 在 第 121 帧 上 插入 一 个 关键 帧 ， 使 用 5 工具 
， 然 后 使 用 乙 工 具 擦 除非 遮 罩 范围 (图 25-31)， 应 用 


图 25-32 Mask 效果 


单 击 鼎 工 具 ， 在 Color Mixer 面板 中 按 图 25 一 


Step 2 使 用 o 工具 配合 Shift 键 在 场景 中 拖 出 一 个 圆 形 ， 这 样 就 得 到 了 一 个 非常 柔和 
的 太阳 图 形 (图 25 一 34) 。 


图 25-33 Color Mixer 面板 图 25-34 太阳 图 形 


Step 3 ” 近 EEEER 器 到 主场 景 ， 新 建 一 个 图 层 ， 将 刚刚 绘制 的 太阳 图 形 拖 入 场景 中 并 
制作 Motion Tween 动画 (图 25-35 和 图 25--36 ) 。 


图 25-35 Motion Tween 动画 25-36 ”Motion Tween 动画 


Step 4 利用 Guide (引导 线 ) 功能 制作 飞 虫 的 动画 (图 25-37)， 在 其 他 图 层 与 之 相 
对 应 的 位 置 插入 关键 帧 并 做 适当 修改 , 使 各 个 动画 相互 间 能 够 完美 地 结合 在 一 起 , 如 图 25 一 
38 和 图 25--39 所 示 。 
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四 多 区 国 


图 25-38 动态 效果 图 25-39 动态 效果 


25.5 ”动画 主场 景 之 四 一 一 冬 


Step 1 按 Ctrl+F8 组 合 键 创建 一 个 Symbol 并 命名 为 “雪花 ， 使 用 工 具 在 场景 中 绘 
制 一 个 雪花 图 形 ， 然 后 按 F8 键 将 它 转 为 Symbol， 如 图 25-40 所 示 。 


图 25-40 转 为 Symbol 


Step 2 在 当前 层 的 第 120 帧 上 插入 关键 帧 ， 利 用 Motion Tween 制作 一 段 雪 花 球 落 的 
动画 效果 ， 然 后 在 Properties 面板 中 设置 雪花 的 旋转 方向 与 旋转 次 数 (图 25-41), 最 后 效果 
如 图 25-42 所 示 。 
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v Properties 


Frame Twew 
| ] 本 和 
:有 避 Frame Label> 


图 25-41 设置 旋转 方向 与 旋转 次 数 图 25-42 Motion Tween 动画 


Step 3 按 


图 25-43 预览 效果 


Step 4 通过 设置 关键 帧 的 方式 来 制作 结尾 动画 的 细节 部 分 ， 由 于 前 面 已 经 有 了 很 详 
细 的 讲解 ， 这 里 就 不 再 重复 了 ， 过 程 如 图 25-44 和 图 25--45 所 示 。 


图 25-44 逐 帧 动画 图 25-45 逐 帧 动画 
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Step 5 完成 后 的 图 层 和 Timeline 结构 如 图 25--46 一 图 25--50 所 示 。 


FRRTTETTETTESTEE3T 未 
25-46 图 屋 和 Timeline 结构 


图 25-49 图 屋 和 Timeline 结构 
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从 | 第 25 章 献 给 母亲 的 礼物 


图 25-50 图 层 和 Timeline 结构 


当 所 有 的 制作 都 完成 后 ， 选 择 File | Export Moive 命令 输出 成 .Swf 格式 的 影片 。 
25.6 小 结 


通过 本 章 的 学 习 ,我 们 已 经 掌握 了 制作 复杂 动画 的 基本 流程 与 创作 思路 , 有 些 朋 友 可 能 
对 制作 复杂 动画 没有 什么 信心 , 其 实 只 要 对 动画 进行 仔细 分 析 后 不 难看 出 : 它 只 是 将 所 学 过 
的 知识 与 制作 技巧 进行 了 一 次 大 综合 ! 单独 拿 出 其 中 的 某 一 部 分 ,还 是 非常 基础 的 动画 制作 
方法 ， 所 以 只 要 有 耐心 ， 敢 于 尝试 ， 制 作 复杂 动画 将 不 是 什么 难事 。 


让 和 


医 尘 思 丰 生长 让 


区 人 克 相 天 一 一 Flash MX 对 委 些 吗 号 皮 、 1 
业 
: 芽 


一 六 
状 


鼠标 的 跟随 效果 


( 畏 隐 藏 按钮 的 制作 技巧 


( 傅 鼠 标 跟随 效 果 的 制作 过 程 
(四 FHlash MX 中 的 鼠标 事件 


(办 重 复 利用 元 件 创作 出 精彩 的 视觉 效果 


这 个 范例 是 一 个 非常 精彩 的 特殊 技巧 , 当 鼠 标 在 画面 上 移动 时 ,就 会 在 滑 过 的 地 方 产生 
出 跟随 鼠标 的 动画 效果 ， 如 图 26-1 和 图 26 一 2 所 示 。 


图 26-1 成 品 效果 之 一 图 26-2 成品 效 果 之 二 


26.1 制作 隐形 按钮 


Step 1 新 建 一 个 空白 文档 ， 在 Properties 面板 中 设置 Size 为 550 x 300Pixels Back- 
ground 设 定 为 #31355B (图 26-3) ， 其 他 参数 保持 默认 。 


四 四 划 国 
h MX 经典 作品 


第 4 篇 网 络 互动 媒体 篇 


FC Document | Size:。 5508300 piwels | Background: 要 FrameRate: j12 fps 
第 二 十 五 章 。 | Pubtsh。 。 FlashPlayer6 | 


图 26-3 在 Properties 面板 中 设置 参数 
Step 2 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 设 置 如 图 26-4 所 示 


Create New Symbol :0 妆 | 
Hum 厌 林 


Behavior : 村 Cancel | 
人 weaa eap | 
图 26-4 新 建 Symbol 
Step 3 按 F6 键 在 Hit 影 帧 上 插入 一 个 关键 帧 ， 使 用 o 工具 绘制 一 个 圆 形 作 为 按钮 的 
反应 范围 ， 其 他 影 帧 内 不 绘制 任何 图 像 (图 26-5 ) 。 


图 26-5 绘制 反应 范围 


26.2 ”制作 鼠标 的 跟随 效果 


Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol 并 命名 为 
“圆圈 *， 使 用 加 工具 在 场景 中 绘制 出 如 图 26-6 所 示 的 图 形 。 


图 26-6 绘制 圆 形 
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鼠标 的 跟随 效果 ] 


Step 2 ”新建 一 个 Symbol 并 命名 为 “跟随 效果 - ， 设 置 Behavior 为 Movie Clip (图 
26--7)。 双 击 Layer 1 改名 为 “按钮 ， 然 后 将 Library 中 的 “按钮 ”元 件 拖 入 场景 中 ， 如 图 
26--8 所 示 。 


Create New Symbol : 站 


ER 
Beharior，G REEEEET 人 

六 考研 多.| 

二 _aaracea | aa | 


图 26-7 新 建 Symbol 图 26-8 将 按钮 元 件 拖 入 场景 中 


Step 3 新 建 一 个 图 层 并 命名 为 “跟随 效果 ， 单 击 第 1 帧 ,在 Actions 面板 中 双击 stop 
命令 (图 26-9)。 

Step 4 按 F6 键 在 第 2 帧 上 插入 一 个 关键 帧 ， 将 Library 中 的 “圆圈 ”元 件 拖 入 场景 
中 ， 如 图 26--10 所 示 。 


Line 1;: stop(); 
图 26-9 在 Actions 面板 中 双击 stop 命令 图 26-10 将 “圆圈 ”元 件 拖 入 场景 中 


Step 5 ”在 第 30 帧 上 插入 关键 帧 ， 打开 Transform 面板 ， 按 图 26-11 所 示 进 行 设 置 ， 
最 后 生成 Motion Tween 动画 (图 26--12) . 
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园田 的 国 
h MX 经 典 作 


第 4 篇 


解析 |@ 


Tv Transform 


如 | 500.0% 4| 500.0% 


权 Constrain 
人 Ratate 4 六 00 
rew 柬 [ 0 5 本 | 


图 26-11 Transform 面板 26-12 生成 Motion Tween 动画 


Step 6 ”选择 第 30 帧 中 的 图 形 ， 在 Properties 面板 中 设置 Alpha 为 0， 如 图 26-13 所 


[ET 司 Instance of 圆 图 
四 芝 习 | [1 
图 26-13 设置 Alpha 
Step 7 单 击 “ 按 钮 ”元 件 ， 在 Actions 面板 中 双击 on 命令 ， 确 定 勾 选 Roll Over， 然 
后 双击 goto 命令 并 在 Frame 后 面 的 对 话 框 中 输入 2 (图 26-14) 。 


RE 
| 镶 sors er [ho naance name aaaoned] ( 扩 国 


Color [Apha 悦 [ce | 


图 26-14 在 Actions 面板 中 设置 参数 


在 按钮 反应 范围 内 按 下 鼠标 左 键 ， 然 后 移 到 按钮 外 放 开 忌 标 左 键 
按 下 键盘 上 指定 的 按键 

鼠标 从 按钮 作用 范围 外 移动 到 按钮 作用 范围 内 
鼠标 从 按钮 作用 范围 内 移动 到 按钮 作用 范围 外 


Drag Over ( 拖 搜 ) 按 下 鼠标 左 键 不 放 ， 从 按钮 作用 范围 外 拖 入 按钮 作用 范围 内 
Drag Out ( 拖 搜 出 ) 按 下 鼠标 左 键 不 放 ， 从 按钮 作用 范围 内 拖 入 按钮 作用 范围 外 
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2 鼠标 的 跟随 效果 | 


26.3 合成 影片 


Step 1 ” 按 EEEE 回 到 主场 景 ， 将 刚刚 制作 的 影片 片段 拖 入 场景 中 不 断 复 制 阵列 ， 最 
终 充满 整个 画面 (图 26--15) 。 


图 26-15 复制 阵列 


复制 的 越 多 越 密 ， 所 得 到 的 效果 就 越 细 腻 。 


Step 2 按 下 Ctrl+Enter 组 合 键 进行 预览 ， 效 果 如 图 26-16 所 示 ，Library 结构 如 图 26 一 


17 所 示 。 


vibrary- 第 二 十 五 章 民 标 的 M。 二 


Button 


Movie Clip 


Graphic 


图 26-16 预览 效果 图 26-17 Library 结构 


当 所 有 的 制作 都 完成 后 ， 选 择 File | Export Moive 命令 输出 成 .Swf 格式 的 影 


四 四 井 国 
h MX 经 典 作 品 解 析 | 爷 


26.4 小结 


这 个 范例 使 用 了 一 个 非常 特殊 的 技巧 : 通过 大 量 复制 隐藏 按钮 来 实现 动画 中 精彩 的 视 
觉 特 效 。 你 可 以 将 导入 的 一 部 分 隐藏 按钮 放大 或 缩小 , 使 鼠标 经 过 时 可 以 产生 出 大 小 不 同 的 
动态 效果 , 或 更 进一步 将 部 分 按钮 做 形状 .颜色 以 及 透明 度 等 属性 的 修改 , 从 而 使 画面 呈现 
出 更 加 丰富 的 视觉 效果 。 
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轩 国 的 国 


图 Sm IM 人 X 


章 Actions 特效 应 用 


Flash 的 两 种 程序 编辑 模式 
利用 Actions 控制 对 象 的 属性 
通过 设置 Actions 来 实现 精彩 的 动画 效果 


熟练 掌握 编程 模式 :变量 设 定 和 程序 结构 等 基础 知识 


| 预览 成 品 | 


这 是 一 个 使 用 Actions 制作 出 来 的 动画 效果 ， 如 图 27 一 1 和 图 27 一 所 未 


中 Mocromedio Flash Player5 


图 27-1 成 品 效 果 之 一 


27.1 制作 动画 的 基本 元 素 


Step 1 新 建 空白 文档 ， 在 Properties 面板 中 设置 Size 为 500 x 440Pixels，Background 
设 定 为 共 000000 (图 27-3) 


四 四 昌国 


Size 500x440pinels Background 国 昌 |。 FrameRate | fps 


A 和 蕴 二 十 六 得- Publisk ”Flash Playere | 
图 27-3 在 Properties 面板 中 设置 参数 


Step 2 按 CtrI+F8 组 合 键 新 建 一 个 ”EXTTTTTT 革 | 
Symbol , 设置 如 图 27--4 所 示 。 单 击 o 工 具 , 在 
Color Mixer 面板 中 设置 填充 方式 为 Radial (图 
27-5)， 然 后 配合 Shift 键 在 场景 中 绘制 一 个 
圆 形 ， 效 果 如 图 27--6 所 示 。 图 27-4 新 建 Symbol 


本 


必 


图 27-5 设置 填充 方式 图 27-6 绘制 圆 形 


Step 3 在 第 10.、 第 20、 第 30 和 第 40 帧 上 分 别 插入 关键 帧 ， 使 用 相同 的 方法 绘制 出 
其 余 的 图 形 ， 注 意 要 在 颜色 、 大 小 和 位 置 上 有 所 区 别 (图 27 一 7) 。 


图 27-7 绘制 图 形 


Step 4 单 击 第 1 帧 ,在 Properties 面板 中 将 Tween 设置 为 Shape 形状 变 形 动画 (图 27 一 
8)， 人 位置、 色彩 关系 如 图 27--9 所 示 。 


27-8 在 Properties 面板 中 设置 形状 变形 动画 参数 
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人 本 4 Actions 特 效应 用 


图 27-9 位置、 色彩 关系 


27.2 ”Actions 特效 应 用 


Step 1 按 上 加 到 主场 景 ， 将 Library 中 的 “元 素 ， 元 件 拖 入 场景 中 并 在 Properties 
面板 中 定义 其 名 称 为 “0 ， 如 图 27 一 10 所 示 。 

Step 2 单 击 第 1 帧 ， 在 Actions 面板 中 单 击 右上 角 的 王 Option 按钮 ， 在 弹出 的 菜单 中 
选择 Ecpert Mede (专家 模式 ) ， 如 图 27 一 11 所 示 。 


Properties 
wY Normal Mode 
了 加 ED 0 2 ViewLine Numbers 
图 27-10 定义 名 称 图 27-11 专家 模式 


Step 3 在 专家 模式 下 ， 手 工 输入 以 下 代码 
研 = 0; 
max = 50; 
SetProperty("0"，_Vislble，ftalse) ， 
SetProperty("0"，_alpha，0) ， 


Step 4 在 第 2 帧 上 插入 关键 帧 ， 在 Actions 面板 的 专家 模式 下 手工 输入 以 下 代码 : 
QuplJicateMovieC1lipP(i-1LI，1I，1i)， 
SetPrOPeItYy (，_Y7 9etRIGCPeTEY( 守 = 工 到) 让 主 /0.57 2 
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setProperty (1i， alpha，getProperty ( 1-1，_alpha )+20) ， 
SetProperty(i， xscale，getProperty (1i-1，_XScale)+10) : 


1 = 工 +1; 


人 新 的 电影 前 辑 ， 而 setProperty 则 可 以 控制 物体 本 身 的 一 些 


特性 ， 例 如 改变 辑 〈M: clip) 的 x、y 轴 人 位置，alpha 〈 透 明度 ) 以 及 x、yY 轴 的 缩放 比 


例 等 等 


Step 5 在 第 3 帧 上 插入 关键 帧 ， 在 Actions 中 输入 以 下 代码 
if (1i<=max) { 
gotoaAnadP1av(2)》， 
}] else { 
S 七 忆 攻 (六 区 


9X ， 如 果 是 的 活 就 执行 gotoAndPlay(2)， 反 之 则 停止 。 


Step 6 ” 按 下 Ctrl+Enter 组 合 键 进行 预览 ， 最 后 效果 如 图 27--12 所 示 


; 有 邮 笔 二 十 六 章 Actions 特 效应 用 


27.3 小 结 


这 一 章 所 学 的 知识 与 前 面 的 章节 有 很 大 的 区 别 : 在 本 实例 中 ，Symbol 的 动态 不 再 依赖 
于 Motion Tween 或 是 Shape 动 男 ， 而 是 完全 靠 Actions 来 驱动 物体 的 移动 . 我 们 通过 Actions 
可 以 创作 出 很 多 充满 交互 性 的 动画 ， 而 交互 功能 又 是 Flash 的 高 级 部 分 ， 也 是 精华 部 分 ， 通 
过 Actions， 我 们 可 以 制作 出 很 多 超 酷 的 动态 网 站 和 Flash 游戏 等 
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DIYERRAL 


本 章 重 点 


制作 鼠标 的 动态 辉 光 效果 
通过 Actions 替换 现 有 的 Windows 鼠标 


继续 了 解 编程 方法 、 变 量 设 定 以 及 程序 结构 等 相关 知识 


预览 成 品 


在 本 实例 中 , 我 们 通过 设置 Actions 使 自己 设计 的 鼠标 替换 了 现 有 的 Windows 鼠标 ， 如 
28 一 1 所 示 。 


图 28-1 成 品 效 果 


操作 步骤 
28.1 制作 基本 元 件 


Step 1 新 建 一 个 空白 文档 ， 在 Properties 面板 中 设置 Size 为 400 x 300Pixels” Back- 
ground 设 定 为 #000000 (图 28-2)， 其 他 保持 默认 


A Documem she 4004300phels_ |。 Backoount 国 | Famepate [2 fps 
第 二 十 七 量 -- Publsh。 。 Flash Player5 | 


图 28-2 在 Properties 面板 中 设置 参数 


Sh MX 经 


典 作品 解析 | 人 @ 


Step 2 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol 并 命名 为 “鼠标 Behavior 设置 为 Graphic ， 
如 图 28 一 3 所 示 


Create New Symbol 区 : | 
II 
Behavior: 人 Wovie Clip Cancel | 


攻 Batton 


Adyvanced | Help | 


图 28-3 新 建 Symbol 


Step 3 ”使 用 “工具 在 场景 中 绘制 鼠标 的 外 轮廓 ， 如 图 28--4 所 示 
Step 4 全 选 鼠标 轮廓 线 ， 配 合 Alt 键 向 右 移动 复制 (图 28 一 5 ) 


28-4 绘制 外 轮 廊 图 28-5 移动 复制 


Step 5 ”使 用 到 工具 将 新 复制 的 图 形 等 比 缩小 并 移动 至 图 28-6 所 示 的 位 置 
Step 6 ”使 用 赤 工 具 对 图 形 进行 填充 ， 然 后 按 Del 键 将 图 形 的 轮廓 线 删 除 (图 28 一 7) 


图 28-6 移动 图 形 图 28-7 对 图 形 进 行 填充 


28.2 ”制作 鼠标 的 辉 光 效果 


Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol 并 命名 为 “鼠标 动态 ， 设 置 如 图 28-8 所 
示 ， 然 后 将 刚刚 绘制 的 鼠标 图 形 拖 入 “Layer 1 中 (图 28 一 9) 
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图 28-8 新 建 Symbol 图 28-9 拖 入 图 形 


Step 2 选择 鼠标 图 形 , 按 Ctrl+C 组 合 键 将 其 复制 ,然后 新 建 一 个 图 层 并 按 Ctrl|+Shift+V 
组 合 键 进行 原 地 粘贴 (图 28-10)， 设 置 Fill Color 为 共 FFFF99 


Step 3 新建，Layer 3” 图 层 ， 使 用 所 工具 在 鼠标 图 形 的 下 面 绘制 一 个 矩形 ， 如 图 
人 


门 加 | 


图 28-10 原 地 粘贴 图 28-11 绘制 矩形 


Step 4 在 第 8 帧 上 插入 一 个 关键 帧 ， 使 用 中 工具 将 矩形 缩小 并 移动 至 图 28-12 所 示 
的 位 置 ， 最 后 生成 Shape 动画 (图 28-13)。 


是 | 一 一 人， 
Shape weemngh 


图 28-12 移动 矩形 
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因 四 朝 国 
人 @@Sh_ MX 


经 


典 作 


第 4 篇 


品 解 析 |@ 


网 络 互动 媒体 篇 


Step 5 “用 鼠标 右键 单 击 “Layer 3” 图 层 ， 在 弹出 的 菜单 中 选择 Mask (图 28 一 14) 
按 下 Enter 键 预 览 Timeline， 就 会 在 鼠标 图 形 上 出 现 动态 的 辉 光 效果 ， 如 图 28--15 所 示 


Macromedia Flash MX - [第 二 十 八 章 DIY 超 酷 妃 标 ] 


Cj55 帮 Folge 和 5 


图 28-14 Mask 图 28-15 动态 辉 光 效 果 


28.3 合成 影片 


Step 1 。 近 EEE2 王 器 到 主场 景 ， 将 Library 了 用 saiboaa 
中 的 “鼠标 动态 ”元 件 拖 入 场景 中 并 在 Prop” 加 记过 
erties 面板 中 定义 其 名 称 为 0"”， 如 图 28--16 村 有 
人 ， 图 28-16 在 Properties 面板 中 设置 参数 
Step 2 单 击 第 1 帧 ， 在 Actions 面板 中 
双击 evaluate 命令 ， 然 后 在 Expression 后 面 的 对 话 框 中 输入 Mouse.hide() ， 如 图 28--17 所 示 。 


轩 Actions for Frame 1 ofLayer Name Layer 1! 


Expresfior | Mouse hide0 


Miscellaneous Actions 之 


Functions 
国 constants 
同 Properties 


图 28-17 在 Actions 面板 中 设置 参数 


人 DIY 超 酷 鼠标 


Step 3 在 Actions 面板 中 双击 startDrag 命令 ， 按 图 28-18 所 示 进 行 设置 


| 加 Actions For Frame 1 of Layer Name Layer 1 
团 stop ^] 
国 stopallsounds Target F 
同 Browser/Network 厂 constraintorectangle 5 
司 Movie Clip Control 克 Loek mouseto center RE 


加 duplicateMovieClip 
二 = 及 久生 


国 onChiipEvYent 

removeMovieClip 

setproperty Mouse.hide 吃 ) 
startDrag 


stopDrag 
updateAfterEvent 
由 | variables 
国 delete 
set variable 号 


[Line 2; StartDrag("0"， true)， 上 


@g@g@gg 


图 28-18 双击 startDrag 命令 


当 影 片 载 和 时， 真正 的 鼠标 被 隐藏 起 来 。 
开始 拖 搜 名 称 为 “0” 的 影片 片段 。 


Step 4 按 下 Ctrl+Enter 组 合 键 预览 ， 最 后 效果 如 图 28 一 19 所 示 ，Library 结构 如 图 
28--20 所 示 。 


Name Knhd 主 


鸭 高 光 Graphic 口 
图 | 鼠标 Graphic 


图 28-19 最 终 效果 图 28-20 Library 结构 
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第 4 篇 风 络 互动 媒体 篇 


28.4 小 结 


在 本 实例 中 , 我们 掌握 了 通过 Actions 替换 现 有 Windows 鼠标 的 方法 ， 并 进一步 了 解 了 
编程 方法 、 变 量 设 定 以 及 程序 结构 等 相关 知识 。 如 果 你 已 经 有 一 个 Flash 个 人 主页 的 话 ， 不 
妨 将 它 放 入 你 的 页 面 中 ， 相 信 一 定 会 使 你 的 主页 更 具 个 性 。 
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第 29 章 [gesrea | 


本 章 重 点 


( 园 如 何 使 旋转 的 影片 动画 衔接 自然 


( 舍 制 作 动态 元 素 丰 富 画 面 的 视觉 效果 
( 辕 掌 握 制作 滑动 菜单 的 技巧 与 思路 


《 罗 如 何 开 启 新 的 浏览 器 窗口 以 供 浏览 


这 是 一 个 网 络 播放 器 的 主 界面 ,场景 中 的 滑动 菜单 使 作品 本 身 更 具 交 互 性 , 如 图 29--1 
和 图 29-2 所 示 。 


图 29-1 成 品 效果 之 一 图 29-2 成 品 效果 之 二 


29.1 制作 基本 场景 


Step 1 启动 Flash MX , 新 建 空白 文档 。 在 Properties 面 板 中 设置 Size 为 600 x 400Pixels 
Background 设 定 为 并 B9E800， 其 他 参数 保持 默认 (图 29-3) 。 


Properties 
多 : Documemk Sie 600x400plaels | Baokoound 三 -| FrameRate [2 ”fps 
利生 -| Paow 和 Doseoe | 


图 29-3 在 Properties 面板 中 设置 参数 
Step 2 双击 Layer 1 改名 为 “背景 "， 使 用 “工具 在 场景 中 绘制 出 基本 的 空间 分 割 线 ， 
如 图 29-4 所 示 。 


图 29-4 绘制 背 最 
Step 3 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 命 名 为 “ 碎 块 ， 使 用 5 工具 随意 绘制 一 
些 图 形 元 素 (图 29-5)。 


图 29-5 绘制 图 形 元 素 


Step 4 在 第 150 帧 上 插入 一 个 关键 帧 ， 使 用 下 工具 将 原 图 形 纵向 拉 长 (图 29 一 6 ) , 
最 后 生成 Shape 动画 ， 如 图 29 一 7 所 示 。 


图 29-6 纵向 拉 长 


Step 5 按 有 BE 王 回 到 主场 景 ， 新 建 一 个 图 层 ， 然 后 将 Library 中 的 “ 碎 块 ”元 件 拖 入 
场景 中 ， 位 置 如 图 29-8 所 示 。 
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图 29-8 将 元 件 拖 入 场景 


Step 6 在 Properties 面板 中 设置 图 形 的 Alpha 为 25%6， 最 后 效果 如 图 29-9 所 示 。 
Step 7 ”使 用 同样 的 方法 制作 另 一 组 图 形 元 素 (图 29-10) ，Shape 变形 过 程 如 图 29- 
11 所 示 。 


图 29-9 设置 图 形 的 Alpha 


图 29-10 图 形 元 素 


29-11 Shape 变形 过 程 


Step 8 按 EEBEz29 回 到 主场 景 ， 新 建 一 个 图 层 ， 将 刚刚 绘制 的 图 形 元 素 拖 入 场景 中 并 
为 场景 添加 一 个 边框 ， 如 图 29-12 所 示 。 
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图 29-12 为 场景 添加 边框 


29.2 ”制作 旋转 的 CD 唱片 


Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 命 名 为 “ 光 
盘  。 使 用 5 等 工具 在 场景 中 绘制 一 个 CD 唱片 (图 29-13)。 


针 


图 29-13 绘制 光盘 


Step 2 新建 一 个 Symbol 并 命名 为 “旋转 光盘 ， 将 Library 中 的 “光盘 ”元 件 拖 入 场 
景 中 ， 在 第 30 帧 上 插入 一 个 关键 帧 并 生成 Motion Tween 动画 (图 29-14) ， 然 后 在 Proper- 
ties 面板 中 设置 CD 光盘 的 旋转 方向 与 旋转 次 数 ， 如 图 29-15 所 示 。 


图 29-14 生成 Motion Tween 动画 图 29-15 设置 旋转 方向 与 旋转 次 数 


@ cD 搓 放 澡 | 


Step 3 单 击 第 30 帧 ， 在 Actions 面板 中 双击 goto 命令 并 在 Frame 后 面 的 对 话 框 中 输 
入 1， 如 图 29--16 所 示 。 


| 四 Actions for Frame 30 of Layer Name Layer 1 


他 GotoandPlag 人 广 GotoandStop 


局 Movie control 


加 goto Scene'; [eurenseeney 
@ on Jpe: | Frame Number 
园 play 

加 stop 

团 stopAllsounds 


园 Browser/Network 
Movie Clip Control 


g 形 征 相同 的 ， 所 以 和 企 循环 播放 时 会 产生 一 种 停顿 的 感觉 ， 为 了 使 动画 
帧 后 直接 跳 回 第 1 帧 而 不 播放 第 


Step 4 新建 一 个 Symbol 并 命名 为 “CD 机 ， 将 刚刚 制作 的 “旋转 光盘 ” 拖 入 场景 
中 ， 然 后 使 用 国 .网 等 工具 绘制 出 光盘 的 播放 器 (图 29-17)。 

Step 5 ” 回 到 主场 景 ， 新 建 一 个 图 层 ， 将 Library 中 的 “CD 机 ”元 件 拖 入 场景 中 ， 双 
击 该 元 件 对 它 进 行 Edit In Place ( 原 地 编辑 ) 。 在 第 1 帧 ， 使 CD 机 处 于 图 29-18 所 示 的 位 
置 ， 在 第 50 帧 插入 关键 帧 ， 向 下 拖 动 CD 机 至 图 29-19 所 示 的 位 置 ， 最 后 生成 Motion tween 
动画 。 


图 29-17 绘制 图 形 图 29-18 第 1 帧 位 置 图 29-19 第 50 帧 位 置 


Step 6 单 击 第 50 帧 ， 在 Actions 面板 中 双击 stop 命令 ， 如 图 29-20 所 示 。 
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29-20 加 入 Stop 命令 


29.3 ”制作 滑动 式 菜单 


Step 1 ”新 增 四 个 按钮 元 件 “Music 1 “Music 2” “Music 3” 和 “Menu”， 如 图 29- 
21 一 图 29-24 所 示 。 


图 29-21 “music 1” 29-22 “music 2” 


Timejine 


图 29-23 “music 3” 图 29-24 “menu” 


Step 2 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol ， 并 命名 为 “播放 菜单 。 使 用 5 工具 先 绘 
制 一 个 底 图 ， 再 将 所 有 的 按钮 元 件 放 置 进 来 ， 如 图 29-25 所 示 。 


个 CD 播放 器 | 


图 29-25 放置 按钮 
Step 3 ” 单 击 红色 的 Menu 按钮 ， 在 Actions 面板 中 输入 以 下 代码 (图 29 一 26) 。 


TY Actions - Button 


全 Actions for [No instance name azxigned] (menu 技 他 ) 


列 Functions 


Une 2 telTarget (ymenu ){ 


才 定 义 其 名 称 为 menu。 


w Actions - Buktton 


| MeioneR Neamosreneaatgned (music 0) 


图 29-27 Actions 面板 
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Step 5 新建 一 个 Symbol， 并 命名 为 “滑动 菜单 。 将 刚 制作 完成 的 “播放 菜单 ” 拖 
入 场景 中 并 在 第 40 帧 上 插入 一 个 关键 帧 (图 29-28) 。 


图 29-28 插入 关键 帧 


Step 6 在 第 20 帧 上 插入 关键 帧 ， 将 图 形 向 右 移动 并 生成 Motion Tween 动画 ， 这 样 
就 形成 菜单 滑 入 滑 出 的 动态 效果 了 ， 如 图 29-29 所 示 。 


29-29 生成 Motion Tween 动画 


Step 7 ”新建 一 个 图 层 ， 在 第 1 和 第 20 帧 上 分 别 插入 关键 帧 ， 然 后 在 Actions 面板 中 
设置 stop 命令 (图 29-30) 。 


图 29-30 设置 stop 命令 


人 LE CD 播放 器 ] 


29.4 合成 影片 


Step 1 。 按 EEBE2 回 到 主场 景 ， 新 建 一 个 图 层 并 命名 为 “menu“。 将 Library 中 的 “ 滑 
动 菜单 元 件 拖 入 场景 的 左 侧 并 在 Properties 面 板 中 定义 其 名 称 为 “menu”, 如 图 29-31 所 示 。 


一 Properties 
名 Movie Cip 了 ] | mstanoe of 油 动 荣 音 Color None 加 
menu Swap-_ | 


图 29-31 定义 名 称 


Step 2 ”使 用 o 工 具 在 场景 的 四 周 制 作 一 个 外 框 (图 29--32)。 


图 29-32 制作 外 框 


所 有 的 制作 都 完成 了 , 按 下 Ctrl+Enter 组 合 键 进行 预览 并 测试 按钮 与 滑动 菜单 的 交互 性 ， 
最 终 效 果 如 图 29--33 所 示 。 


玫 笔 二 十 八 章 CD 基 放 器 


图 29-33 预览 效果 
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第 4 篇 


29.5 小 结 


通过 本 章 的 学 习 ， 我 们 更 加 深入 的 了 解 了 如 何 制 作出 具有 交互 性 的 网 络 动画 ， 可 以 看 
出 : Flash 不 仅 能 胜任 动画 短片 、MTV 以 及 贺卡 等 动画 形式 的 制作 ， 而 且 在 动态 网 站 和 交互 
特效 的 应 用 上 也 是 大 有 作为 的 .精彩 动画 特效 的 诞生 往往 取决 于 能 否 熟练 应 用 这 些 技术 与 方 
法 。 


绘制 基本 动画 场景 的 方法 与 技巧 

如 何 制 作 精彩 的 文字 淡 入 淡出 效果 

深入 学 习 Mask ( 遮 章 ) 技巧 的 应 用 范围 
通过 按钮 来 控制 整个 动画 的 进程 

制作 迷你 Flash 游 戏 的 基本 方法 与 创作 思路 


合成 影片 的 技巧 与 方法 


这 是 一 个 相对 简单 一 些 的 小 动画 , 但 其 中 包含 了 很 多 的 制作 技巧 与 创作 思路 , 熟练 应 用 
这 些 技术 将 会 为 你 的 作品 增光 添 采 ， 如 图 30-1 一 图 30-4 所 示 。 


请 原谅 我 对 惩 情 的 自私 ， 


图 30-1 成 品 效果 之 一 图 30-2 成 品 效果 之 二 
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四 多 区 国 


图 30-3 成品 效 果 之 三 图 30-4 成 品 效果 之 四 


操作 步骤 
30.1 制作 游戏 的 基本 场景 


Step 1 新 建 一 个 空白 文档 ， 在 Properties 面板 中 设置 Size 为 550 x 370Pixels Back- 
ground 设 定 为 共 DBDBDB (图 30-5) 。 
Tv Properties 
于 Doeumem She 50370phwz | Backgoud [| FameRas [2 fps 
第 二 十 大量 | Publsh 。_FhshPlywes | 
图 30-5 在 Properties 面板 中 设置 参数 


Step 2 ”双击 Layer 1 改名 为 “背景 "， 使 用 o 工 具 在 场景 中 绘制 一 个 矩形 ， 并 用 “ 工 
具 将 图 形 轮廓 调整 为 曲线 (图 30-6)。 

Step 3 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 命名 为 “造型 1"。 使 用 z 工具 在 场景 中 
绘制 出 人 物 的 外 轮廓 ， 如 图 30-7 所 示 。 


、 
AN 、 


二 运 吕 此 时 国 药 且 响 交 上 而 


7 区 生 有 | 


图 30-6 调整 为 曲线 图 30-7 绘制 人 物 的 外 轮廓 


Step 4 使 用 “工具 画 出 人 物 的 明暗 交界 线 ， 并 用 * 工具 调整 曲线 的 圆滑 度 (图 30-8) 。 
Step 5 使 用 & 工 具 对 图 形 进行 填充 (图 30-9)， 然 后 用 ”工具 对 图 形 的 细节 进行 绘制 ， 
如 图 30--10 所 示 。 


图 30-8 调整 明暗 交界 线 图 30-9 填充 色彩 图 30-10 细节 绘制 


Step 6 按 有 多 回 到 主场 景 ， 新 建 一 个 图 层 ， 将 刚刚 绘制 的 人 物 图 形 拖 入 场景 的 右 
下 角 (图 30-11) 。 

Step 7 ”新 建 一 个 图 层 ， 使 用 Motion Tween 方式 制作 一 段 文字 标题 的 渐变 动画 ， 如 图 
30-12 所 示 。 


3 

F 兰 关 
| 
> 光一 | : Motion Tweening] 


Motion Tweenin 


图 30-11 拖 入 场景 图 30-12 文字 标题 的 渐变 动画 


Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 使 用 ”工具 在 场景 中 绘制 一 个 对 话 框图 
形 ， 如 图 30-13 所 示 。 

Step 2 ” 回 到 主场 景 ， 新 建 一 个 图 层 ， 在 第 31 帧 上 插入 一 个 关键 帧 ， 然 后 将 刚刚 绘 
制 的 对 话 框图 形 拖 入 场景 中 并 生成 一 段 长 度 为 24 帧 的 Motion Tween 动画 (图 30-14) 。 


图 30-13 绘制 图 形 图 30-14 Motion Tween 动画 


Step 3 新建 一 个 图 层 并 命名 为 “ 蒙 板 “， 按 F6 键 在 第 55 帧 上 插入 关键 帧 ， 然 后 使 用 
工具 在 对 话 框图 形 中 绘制 一 个 无 填充 色 的 答 形 ， 如 图 30-15 所 示 。 


图 30-15 绘制 矩形 


G | 


Step 4 单 击 & 工 具 ， 在 Color Mixer 面板 中 设置 填充 方式 为 Lineal (线形 渐变 ) ， 并 设 
定 第 一 个 色 标 为 纯 黑 色 ,， 第 二 个 色 标 为 纯 和 白色 (图 30-16), 填充 后 的 效果 如 图 30-17 所 示 。 


图 30-16 Color Mixer 面板 图 30-17 填充 效果 


第 二 个 色 标 中 所 指定 的 颜色 ,一定 要 和 对 话 框 中 的 颜色 完全 一 样 ， 这 样 在 以 后 制作 M a s k 效果 时 ， 
背景 才能 与 淡出 的 文字 完全 融合 在 一 起 。 

本 章 中 的 对 话 框 是 纯 自 色 的 ， 所 以 相应 的 第 二 个 色 标 的 颜色 也 是 纯 白色 ， 如 果 对 话 框 的 颜色 变 
更 ， 色 标的 颜色 也 要 随 之 变更 。 


Step 5 ”我 们 需要 的 填充 色 应 该 是 由 上 往 下 ， 从 自 色 逐 渐 过 渡 到 黑色 的 渐变 色彩 ， 因 
此 要 使 用 到 工具 对 填充 色 进行 方向 和 色彩 比例 上 的 调整 (图 30-18)。 


图 30-18 调整 填充 


四 多 钊 国 
sh MX 经 典 作 品 解 析 | 仓 


第 4 篇 网 络 互 动 媒体 篇 


时 ， 这 样 文字 在 刚 出 来 时 才 是 清晰 可 见 的 ， 相对 的 上 半 部 也 应 


Step 6 在 蒙 板 图 层 的 上 面 新 建 一 个 “文字 ”图 层 ， 在 第 55 帧 上 插入 关键 帧 并 
使 用 痊 工 具 输入 一 些 文字 ， 如 图 30--19 所 示 。 


时 间 不 再 是 岁月 的 重度. 
经 历 不 再 是 生 辣 的 足 济 . 
自从 耶 时 起 . 你 开始 车 直子 
无 限 的 空间 要 隐 伴 哪 个 隶 近 
入 ! 人 


总 


我 怕 高 你 太 交 会 伤 到 你 ! 


图 30-19 输入 文字 


Step 7 单 击 第 55 帧 ， 使 文字 处 于 图 30-20 所 示 的 位 置 ， 在 第 270 帧 插入 关键 帧 ， 向 
上 拖 动 文字 至 图 30-21 所 示 的 位 置 ， 最 后 生成 Motion tween 动画 。 


因为 我 受 你 ， 所 以 我 起 分 分 
秒 秒 和 你 在 一 起 ! 因为 我 受 
你 ， 所 以 我 又 想 过 元 你 ， 因 
为 我 伯 高 你 太 近 合 伤 到 你 ! 


图 30-20 第 55 帧 位 置 图 30-21 第 270 帧 位 置 
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Step 8 右键 单 击 “文字 ”图 层 ， 在 弹出 的 菜单 中 选择 Mask 选项 (图 30-22)， 然 后 
按 下 Enter 键 预览 Timeline， 就 会 呈现 出 文字 的 淡出 效果 了 ， 如 图 30-23 所 示 


称 和 办 和 你 在 一 起 1! 因为 我 
你 ， 所 以 我 又 想 运 均 你 ， 因 
为 我 伯 高 你 太 近 会 伤 到 你 ! 


图 30-22 执行 Mask 图 30-23 预览 效果 


30.3 动画 的 控制 按钮 
Step 1 新 增 两 个 按钮 元 件 ， 如 图 30-24 和 图 30-25 所 示 。 


图 30-24 按钮 元 件 图 30-25 按钮 元 件 


Step 2 按 IEE 回 到 主场 景 ， 新 建 一 个 “按钮 ”图 层 ， 在 第 271 帧 上 插入 关键 帧 ， 
然后 将 Library 中 的 “PLAY ”按钮 拖 入 场景 中 (图 30-26)。 
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图 30-26 将 PLAY 按钮 拖 入 场景 


Step 3 单 击 “ 背 景 ”图 层 ， 按 F6 键 在 第 272 帧 上 插入 关键 帧 ， 使 用 5 工具 绘制 一 个 
新 的 背景 图 形 ， 如 图 30-27 所 示 。 


图 30-27 绘制 背景 


Step 4 单 击 “按钮 ”图 层 ， 在 第 272 和 第 273 帧 上 分 别 插入 关键 帧 ， 然 后 将 Library 
中 的 “100kg ”按钮 拖 入 场景 的 左上 角 (图 30-28) 。 


图 30-28 拖 入 场景 


人 LE 迷你 游戏 ] 


Step 5 单 击 第 271 帧 ， 在 Actions 面板 中 为 其 添加 stop 命令 ， 如 图 30-29 所 示 。 


| 国 太 ctions for Frame 271 of Layer Name 技 乌 


图 30-29 在 Actions 面板 中 设置 参数 
Step 6 用 同样 的 方法 为 第 272 和 第 273 帧 上 添加 stop 命令 ， 然 后 按 F7 键 在 第 274 帧 


村 宣 | 富 | 四 | 品 273 12.07s 
图 30-30 插入 空白 关键 帧 


30.4 制作 游戏 动画 
Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 并 命名 为 “造型 2 。 使 用 和 等 工具 
绘制 出 图 30-31 所 示 的 人 物 造型 。 


| 


测 凯 区 品 


图 30-31 绘制 人 物 造形 
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Step 2 新建 一 个 Symbol， 并 命名 为 “100kg 动画 ， 将 刚 绘制 的 人 物 图 形 拖 入 场景 
中 。 新 建 一 个 图 层 ， 使 用 等 工具 绘制 一 个 铅球 图 形 (图 30-32)， 最 后 效果 如 图 30-33 所 


[ee 


图 30-32 绘制 过 程 


图 30-33 预览 效果 


Step 3 为 动画 添加 更 多 的 细节 ， 例 如 人 物 的 投影 和 身体 额 样 的 动态 效果 (图 30-34 
和 图 30-35) ，Timeline 结构 如 图 30-36 所 示 . 


图 30-34 绘制 细节 图 30-35 绘制 细节 
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图 30-36 Timeline 结构 
Step 4 按 Ctrl+L 组 合 键 打开 Library， 用 鼠标 右键 单 击 “100kg 动画 ”元 件 ， 在 弹出 
的 菜单 中 单 击 Duplicate (复制 )， 如 图 30-37 所 示 。 
Step 5 在 弹出 的 Duplicate Symbol 对 话 框 中 按 图 30-38 所 示 进 行 设置 


过 


~ tibrary - 第 三 十 章 过 你 让。 渤 


Duplicate Symbol 3 X| 


Behavior， 人 和 ovie Clip Cancel | 
三 Button 


1 二 酸 呈 Aavancea | ia | 
图 30-37 Duplicate ( 复制 ) 图 30-38 Duplicate Symbol 
Step 6 ”双击 进入 “200kg 动画 ”的 编辑 状态 ， 在 原 动 画 的 基础 上 制作 第 2 个 铅球 下 


图 30-39 动画 效果 图 30-40 动画 效果 
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Step 7 单 击 第 39 帧 ， 在 Actions 面板 中 双击 goto 命令 并 在 Frame 后 面 的 对 话 框 中 输 
入 10 (图 30-41)，Timeline 结构 如 图 30--42 所 示 . 


国 Actions for Frame 39 of Layer Name Layer 3 


30-41 Actions 面板 30-42 Timeline 结构 


图 30-43 动态 效果 图 30-44 动态 效果 图 30-45 动态 效果 


Step 9 单 击 第 39 帧 ， 在 Actions 面板 中 添加 stop 命令 (图 30-46)， 最 后 Timeline 结 
构 如 图 30-47 所 示 。 


Actions - Frame 
einein 
国 Actiors for Frame 39 of Layer Name Layer 3 
本 人 


园 Movie Clip Control 


了 如 五 ET 
图 30-46 在 Actions 面板 中 设置 参数 图 30-47 Timeline 结构 


迷你 游戏 | 


30.5 合成 游戏 动画 
Step1 按 回 到 主场 景 ， 新 建 一 个 图 层 ， 在 第 272 帧 上 插入 关键 帧 ， 然 后 将 


Library 中 的 “100kg 动画 ” 拖 入 场景 中 (图 30-48) 。 

Step 2 在 当前 层 的 第 273 帧 上 插入 一 个 关键 帧 ， 将 原 图 形 删 除 。 然 后 拖 动 Library 中 
的 “200kg 动画 ”至 场景 中 ， 按 下 刘 按 钮 ， 对照 前 一 帧 将 元 件 移 动 到 相同 的 位 置 , 如 图 30 一 
49 所 示 。 


*。。*。 国 
个 | 的 辐 可 到 加 [22 [2z0fps [2265 训 


图 30-48 将 “100kg 动画 ” 拖 入 场景 中 图 30-49 移动 到 相同 位 置 


Step 3 在 当前 层 的 第 274 帧 上 插入 关键 帧 , 将 原 图 形 删 除 。 然 后 将 Library 中 的 “300kg 
动画 ”元 件 拖 入 场景 中 (图 30-50)。 


图 30-50 将 “300kg 动画 ”元 件 拖 入 场景 中 


办 四 贡 国 
MX 经典 作品 解析 | 人 
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Step 4 按 F5 键 将 当前 层 的 时 间 轴 延长 至 第 313 帧 处 ， 如 图 30-51 所 示 。 


| 辐 避 | 利加 [313 [120fps | 260s 1 


图 30-51 延长 时 间 轴 


Step 5 单 击 “按钮 图 层 第 271 帧 内 的 “PLAY 按钮， 在 Actions 面板 中 按 图 30-- 
52 所 示 进 行 设置 。 


| 外 Actions for [No instance name assigned] (play) 


GotoandPlag ”全 GotoandStop 
Scene:- |<current scene> 


Jpe: | Frame Number 
[ER 
= 为 汐 币 


30-52 在 Actions 面板 中 设置 参数 


Step 6 单 击 当 前 层 的 第 272 帧 ， 选 取 场 景 中 的 “100kg ”按钮 ， 在 Actions 面板 中 按 
30-53 所 示 进 行 设置 。 


[所 Actions for [No instance name assigned] (100) 


人 GotoandPlag “三 GotoandStop 


30-53 在 Actions 面板 中 设置 参数 


@ 迷你 % 戏 | 


Step 7 单 击 第 273 帧 中 的 “100kg 按钮 ， 在 Actions 面板 中 按 图 30--54 所 示 进 行 设 
置 。 


Actions - Button 
| | Actions for [No instance name assigned] [100) 


人 GotoandEIa 人 GotoandStop 
Scene: |]<current sceney> 


了 pe: [Fane Number 
Frame: 区 


二 = 为 名 和 引 
on (press){ 


忠 转 到 第 2 7 2 帧 并 播 


第 273 帧 并 播放 “200kg 


300 kg 动画 "。 


Step 8 利用 所 学 的 知识 为 影片 添加 一 个 结尾 动画 ， 如 图 30-55 所 示 。 


T Timeline 


| 和 和 网民 


图 30-55 添加 结尾 动画 
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所 有 的 制作 都 完成 了 , 按 下 Ctrl+Enter 组 合 键 进行 预览 并 测试 按钮 的 交互 性 以 及 影片 的 
跳 转 ， 如 确定 没有 问题 后 选择 File | Export Movie 命令 输出 成 .Swf 格式 文件 。 


30.6 ”小结 


看 过 本 章 中 完整 的 制作 流程 后 ,不 知 你 是 否 对 Flash 动画 有 了 深入 的 了 解 . 也 能 够 创作 
出 同样 精彩 的 动画 效果 了 。 软 件 是 设计 师 实现 自己 设计 构想 的 一 种 工具 , 我 们 要 向 画家 了 解 
自己 的 颜料 一 样 去 了 解 软件 本 身 的 各 种 功能 ,这 样 才 可 以 更 加 轻松 自如 的 进行 设计 和 表现 自 
己 的 创意 。 但 也 不 要 过 分 依赖 软件 ， 否 则 我 们 的 作品 会 变 得 没有 个 性 、 毫 无 光彩 。 


制作 MTYV 的 基本 流程 与 创作 思路 


如 何 导入 截 选 的 声音 文件 

绘制 草图 、 制 作 分 镜头 与 上 机 着 色 

使 用 Flash MX 各 种 绘图 工具 快速 绘制 人 物 图 形 的 技巧 
掌握 精确 计算 时 间 段 的 方法 

利用 Guide 实 现 人 物 行走 的 动态 效果 


Flash MX 中 对 口 型 的 方法 


这 是 根据 流星雨” 改编 的 Flash MTV， 完 全 是 动画 卡通 的 形式 。 所 以 不 仅 要 求 我 们 要 
具备 一 定 的 电脑 绘图 基础 ， 还 要 能 熟练 运用 各 种 制作 技巧 ， 如 图 31-1 一 图 31-6 所 示 . 


图 31-1 成 品 效果 之 一 


图 31-2 


vvTv 


成 品 效果 之 二 
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图 31-3 成 品 效果 之 三 图 31-4 成 品 效果 之 四 


图 31-5 成 品 效果 之 五 图 31-6 成 品 效果 之 六 


31.1 导入 截 选 的 声音 文件 


Step 1 首先 选择 一 首 自己 喜欢 的 歌曲 ， 再 使 用 Cooledit、Cakewalk 或 者 超级 解 霸 xp 
等 软件 截 选 出 最 精彩 的 一 部 分 , 本 例 中 所 截 选 的 是 “流行 雨 " 中 的 一 段 (保存 在 附 赠 光 盘 中 
素材 | mtv | 流星 雨 一 最 终 片段 .WAV) 。 


Step 2 ”启动 Flash MX， 新 建 空 白文 档 ， 选 择 File | Import (导入 ) 命令 ， 将 声音 文 
件 导 入 Flash 中 (图 31-7)。 
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图 31-7 导入 声音 文件 


Step 3 将 Library 中 的 声音 文件 拖 入 场景 中 ， weF 
单 击 Properties 面板 中 的 Edit 按钮 (图 31-8) ， 在 弹 
出 的 Edit Envelope 面板 中 对 声音 文件 进行 编辑 如 | 一 一下 hhhwdhhy 
31-9 所 示 。 oo 

一 
上代 全 一 了 人 TD as 直 __ums | 
31-8 在 Properties 面板 中 单 击 Edit 按钮 31-9 在 Edit Envelope 面板 中 编辑 声音 
文件 


Step 4 在 Timeline 中 对 整个 声音 文件 进行 分 段 ， 分 段 的 方法 是 在 歌词 或 是 音乐 的 转 
折 处 插入 关键 帧 ， 然 后 在 Frame Label 中 输入 一 些 具 有 提示 性 的 文字 ， 如 图 31-10 所 示 。 


Soun 中 [ 态 旺 两 -最 多 片 所 司 
Effect 1 EF =] Edit- | 
Sync: [seem 了 二 ee tmes 


4 科 kHz Stereo16 Biti0l0s178192kB 


图 31-11 将 声音 设 定 为 Stream ( 流出 ) 声音 
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31.2 绘制 草图 、 制 作 分 镜头 与 上 机 着 色 


Step 1 在 正式 上 机 制 做 前 ， 要 先 在 草稿 纸 上 绘 制 出 关键 人 物 与 场景 的 草图 (图 31 一 
12) ， 确 保 在 制作 过 程 中 条 理 清 晰 ， 心 中 有 数 。 否 则 在 没有 任何 准备 的 情况 下 去 言 目 制作 ， 
只 会 让 你 心烦 意 乱 ， 最 后 只 有 放弃 的 念头 。 


图 31-12 草图 的 绘制 


Step 2 ”用 扫描 仪 将 绘制 完成 的 草图 扫 入 计算 机 , 然后 在 Photoshop 
等 软件 中 将 图 像 存 成 .jpg 格式 的 文件 。 回 到 Flash 中 ,选择 File | Import 
命令 ， 将 文件 草图 导入 场景 中 ， 如 图 31-13 所 示 。 
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[TREE 对 


SA This file appears to be part of a sequence of images, Do you want to mport 避 of the images in the sequence? 


图 31-14 是 否 将 连续 的 文件 导入 


Step 3 按 CtrlI+F8 组 合 键 新 建 一 个 Symbol ”本 二 
将 扫描 的 位 图 拖 入 场景 中 ,然后 在 第 2 帧 上 插入 关 
键 帧 并 将 原 图 像 删除 。 按 下 鱼 按 钮 ， 对 照 前 一 帧 进 


行 描 图 ， 如 图 31-15 所 示 。 有 语 ] 全 咱 +| 让 疡 | 四 | [了 2 


图 31-15 对 照 前 一 帧 进行 描 图 


各 一 层 ， 这 样 便 于 制作 


Step 4 使 用 有 工具 描 出 人 物 的 轮廓 ， 如 图 31--16 所 示 。 
Step 5 ” 描 出 轮廓 后 ， 使 用 & 工 具 为 图 像 上 色 (图 31-17)。 


/ 7 1// 
上 / 当 | 
| AAA | 


图 31-16 绘制 轮廓 图 31-17 填充 色彩 


Step 6 使 用 7 工具 画 出 图 形 的 明暗 交界 线 ， 然 后 使 用 & 工 具 进 行 填充 并 按 Del 键 将 轮 
廓 线 删 除 ， 过 程 如 图 31--18 所 示 。 
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图 31-18 绘制 过 程 
31.3 _ MTV 制作 过 程 大 揭 密 
用 Flash 制 作 MTV,， 虽然 工作 量 很 大 但 并 不 困难 ,很 多 地 方 只 是 将 某 一 项 技术 不 断 的 重 
复 应 用 。 相信 读者 看 到 这 里 , 已 经 具备 了 一 定 的 制作 基础 了 , 此 时 如 果 再 将 所 有 重复 的 步骤 
全 部 一 一 列 出 , 未 免 有 点 烦琐 。 所 以 只 要 掌握 本 章 中 关键 的 技术 要 点 与 创意 , 制作 出 类 似 的 
MTV 已 经 不 成 问题 了 。 
31.3.1 制作 山脉 、 星 空 的 动态 效果 


Step 1 按 Ctrl+F8 组 合 键 新 建 三 个 Symbol， 使 用 冯 .可 等 工具 在 每 个 Symbol 中 绘制 出 
) 不 同 的 山脉 图 形 ， 如 图 31-19 一 图 31-21 所 示 。 


-下 人 量 起 到 关 画 全 网 到 生 旭 要 志 闻 辽 上 
二 


于 到 夯 面 醒 丽 是 间 许 炸 至 画 玉 至 同居 于 芭 芷 信 迎 人: 
ES 


图 31-19 绘制 山脉 图 31-20 绘制 山脉 图 31-21 绘制 山脉 


别 ， 以 便 营 造 出 具有 远近 虚实 的 层次 效果 


Step 2 按 有 BE 加 到 主场 景 ， 新 建 三 个 图 层 ， 将 刚刚 绘制 的 三 个 山脉 图 形 分 别 拖 入 
与 之 相对 应 的 图 层 中 , 然后 利用 Motion Tween 制 作出 具有 不 同 运动 方向 的 山脉 动画 效果 (图 
31 一 221h 。 


MTV 的 制作 


图 31-22 制作 Motion Tween 动画 


Step 3 ”背景 中 忽 明 忽 暗 的 星空 是 通过 设置 物体 的 Alpha (透明 度 ) 来 实现 的 ， 如 图 
31--23 所 示 。 


Properties 


回 [ae。 ”本 | waneeak Town 
TS | 上- 引 Feff 


图 31-23 设置 物体 的 Alpha (透明度 ) 


31:3,2 ”制作 月 亮 、 湖 光 的 效果 

Step 1 新 建 一 个 Symbol， 单 击 & 工 具 ， 在 Color Mixer 面板 中 设置 填充 方式 为 Radial 
( 圆 形 渐变 ) ， 将 第 二 个 色 标 的 Alpha (透明 度 ) 设置 为 0， 以 便 使 光 晕 能 够 逐渐 淡化 并 融入 
背景 中 (图 31 一 24)。 


31-24 第 二 个 色 标 的 Alpha 设置 为 0 


Step 2 ”使 用 5 工具 在 场景 中 拖 出 一 个 圆 形 ， 这 样 就 得 到 了 一 个 非常 柔和 的 光学 效果 
(图 31--25) 。 
Step 3 ”新 建 一 个 图 层 ， 在 光 晕 的 基础 上 绘制 一 个 圆 形 ， 最 后 效果 如 图 31--26 所 示 
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图 31-25 和 柔和 的 光 晕 效果 图 31-26 预览 效果 


Step 4 按 有 39 回 到 主场 景 ， 新 建 一 个 图 层 ， 将 月 亮 元 件 拖 入 其 中 。 使 用 ao 工具 在 
场景 中 绘制 一 个 矩形 作为 湖面 , 填充 色 的 设置 如 图 31-27 所 示 , 最 后 效果 如 图 31-28 所 示 


图 31-27 设置 填充 色 图 31-28 湖面 效果 


Step 5 下 面 来 制作 湖面 上 的 动态 反光 ， 通 过 对 这 些 细节 的 描绘 ， 可 以 大 大 增加 作品 
的 感染 力 。 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 使 用 “工具 绘制 出 如 图 31-29 所 示 的 图 形 


图 31-29 绘制 图 形 


VEEEvvoor 


Step 6 在 第 20 上 插入 关键 帧 ， 使 用 关 工 具 将 图 形 压 扇 (图 31-30)， 然 后 在 Proper 一 
ties 面板 中 设置 Alpha 为 43286 并 生成 Motion Tween 动画 (图 31--31) 


图 31-30 将 图 形 压 扁 


相 可 富 和 | 加 三 25 1261s | ts 二 
= 


图 31-31 生成 Motion Tween 动画 


Step 7 ”在 第 40 和 第 60 帧 上 分 别 插入 关键 帧 ， 使 用 同样 的 方法 继续 制作 ， 最 后 效果 
如 图 31 一 32 所 示 ， 


图 31-32 生成 Motion Tween 动画 


Step 8 如 法 炮制 制作 第 二 层 湖 面 反 光 (图 31-33)。 回 到 主场 景 ， 将 刚刚 制作 的 “ 反 
光 ”元件 放置 在 “湖面 ”图 层 之 上 ， 按 下 Ctrl+Enter 组 合 键 进行 预览 ， 最 后 形成 的 动态 效果 
如 图 31--34 所 示 。 


图 31-33 第 二 层 湖面 反光 图 31-34 动态 效果 


265 


四 四 昌国 


31.3.3 ”对 口 型 
Step 1 在 制作 MTV 的 过 程 中 ， 对 口 型 是 一 项 必 不 可 少 的 工作 ， 具 体 的 方法 是 在 歌词 
转变 的 位 置 上 插入 关键 帧 ， 然 后 使 用 绘图 工具 对 面部 表情 进行 重 绘 (图 31-35)。 
Step 2 ”在 当前 层 的 第 302 帧 上 插入 关键 帧 ， 先 用 2 工具 将 需要 改动 的 位 置 擦 除 (图 
31--36) ， 再 使 用 7 工具 重新 绘制 ， 如 图 31--37 所 示 。 


卫 8 
SS @m2。 改天 
图 31-35 对 面部 表情 进行 重 给 图 31-36 控 除 图 31-37 重新 绘制 


Step 3 ”制作 蚜 眼 的 动态 效果 也 使 用 了 同样 的 方法 ， 如 图 31 一 38 所 示 。 


E 


和 
em 
图 31-38 虐 眼 的 动态 效果 


31.3.4 制作 人 物 行走 的 动态 效果 


Step 1 将 绘制 好 的 人 物 图 形 导 入 场景 中 ， 双 击 该 图 形 进入 Edit In Place ( 原 地 编辑 ) 
状态 ， 用 鼠标 右键 单 击 Layer 1， 在 弹出 的 菜单 中 选择 Add Motion Guide 增加 引导 线 图 层 
(图 31--39) 。 


31-39 Add Motion Guide 31-40 绘制 曲线 


Step 3 ” 单 击 第 一 帧 ， 使 用 * 工具 将 人 物 图 形 的 中 心 点 与 引导 线 的 起 点 对 齐 ， 然 后 在 
第 100 帧 插入 一 个 关键 帧 ， 将 图 形 的 中 心 点 与 引导 线 的 终点 对 齐 ， 最 后 生成 Motion Tween 
动画 (图 31-41) 。 


31-41 生成 Motion Tween 动画 


Step 4 在 人 物 图 层 的 下 方 新 建 一 个 “阴影 ” 图 层 , 使 用 “工具 沿 着 地 面 的 起 伏 
绘制 一 个 阴影 ， 如 图 31--42 所 示 。 


轩 人 @ 蝎 国 
@Sh_MX _ 经 


典 作 品 


图 31-42 绘制 阴影 


Step 5 在 Properties 面板 中 设置 阴影 的 Alpha 为 47% ， 这 样 就 使 投影 产生 出 半 透 明 的 
效果 ， 增加 了 画面 的 真实 感 (图 31-43) 。 


图 31-43 设置 阴影 的 Alpha 


Step 6 利用 同样 的 方法 为 “阴影 ”图 层 添 加 Guide (引导 线 )， 按 下 Ctrl+Enter 组 合 键 
进行 预览 ， 就 可 以 看 到 人 物 行 走 的 动态 效果 了 ， 如 图 31-44 所 示 
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DIE 


| 25 122 | ie 坟 _ | 


图 31-44 预览 效果 


31.3.5 制作 钉子 的 运动 轨迹 


Step 1 同样 使 用 Guide 方 式 为 钉子 添加 引导 线 ,设置 好 起 点 与 终点 后 生成 Motion Tween 
动画 ， 如 图 31--45 所 示 


1 
图 31-45 添加 引导 线 


Step 2 在 Properties 面板 中 设置 钉子 的 旋转 方向 并 勾 选 Orient to path (图 31-46) 最 
后 钉子 的 运动 效果 如 图 31-47 所 示 。 


有 Frame | Tween [Moon =] 到 Scale | Sound: [None =] 
Frame Label Ease: [ 


| Effect None ~ 

ss 1 | Eeee [ee =- 三 | _E | 
| 
| 区 swe 区 snap No sound seleoted 


图 31-46 勾 选 Orient to path 
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图 31-47 预览 效果 
31.3.6 ”挥手 的 动态 效果 
Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 使 用 “工具 在 场景 中 绘制 出 手 的 轮廓 线 ， 
如 图 31-48 所 示 。 
Step 2 ”使 用 感 工具 对 图 形 的 受 光 面 和 被 光 面 进行 填充 (图 31-49 ) 。 


图 31-48 绘制 图 形 图 31-49 填充 色彩 


Step 3 。 按 ES 二 器 到 主场 景 ， 将 刚刚 绘制 的 手掌 图 形 拖 入 至 合适 的 位 置 ， 如 图 31 一 
50 所 示 。 
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Step 4 通过 插入 关键 帧 的 方式 对 动作 进行 调整 ， 如 图 31--51 所 示 。 


图 31-51 对 动作 进行 调整 
31.3.7 ”制作 黑色 外 框 


当 整 个 动画 制作 完成 后 , 要 在 场景 四 周 蒙 上 一 层 黑色 的 外 框 ,这样 无 论 如何 拖 搜 浏览 器 
或 是 全 屏 放 大 ， 场 景 外 的 瑕 钼 都 不 会 被 显示 出 来 ， 如 图 31-52 所 示 。 


本 旧 85 台 95 100 105 110 115 120 125 130 135 


| 到 可 到 加 [6 20f9s [2 可 二 可 


图 31-52 制作 黑色 外 框 
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31.4 小结 


到 此 为 止 , 我 们 已 经 学 习 了 很 多 的 Flash 动 画 技巧 和 制作 方法 ,制作 任何 类 型 的 Flash 动 
画 都 应 该 不 成 问题 了 。 但 我 们 对 自身 水 平 提高 的 要 求 是 无 止境 的 ， 在 精通 软件 操作 的 基础 
上 .我们 要 在 作品 中 深入 体现 出 自己 所 要 表达 的 情感 与 创意 , 而 不 能 使 作品 仅仅 停留 在 技术 
表层 上 ， 做 到 这 一 点 ， 你 的 作品 将 会 影响 一 代 甚至 几 代 人 。 

再 重复 说 一 次 : Flash 正如 一 只 画笔 ， 请 用 它 来 记忆 你 生活 中 的 丝 丝 记忆 吧 | 
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快速 绘制 卡通 形象 的 基本 技巧 与 方法 
模拟 镜头 推拉 、 挪 、 移 的 动态 效果 
如 何 制作 局 部 特写 的 镜头 效果 

重复 利用 元 件 快速 实现 影片 的 动态 效果 
制作 网 络 宣传 动画 的 基本 思路 与 过 程 


如 何 制作 影片 的 预 载 画面 


预览 成 品 


这 是 一 个 完全 卡通 形式 的 Flash 网 络 宣传 动画 ,其 中 包括 了 很 多 非常 实用 的 动画 制作 技 
巧 以 及 制作 影片 预 载 画面 的 方法 与 过 程 ， 如 图 32-1 一 图 32--5 所 示 


cromedia riash RIVER GE。 
| 文件 (E) 查看 (由 ”控制 (c) 才 助 


图 32-1 成 品 效果 之 一 
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CR Elaglz 
文件 (E) 查看 ()， 控制 (5) 性 助 


岂 Macromedia Flash Player 6 刘 =|D| xj| 


| 文件 (E) 查看 (Y) 控制 (c) 笑 助 


图 32-2 成 品 效果 之 二 图 32-3 成 品 效果 之 三 


CR -外 | 轧 Macromedia Flash PlayeriGS To |E 
文件 (E) 查看 (控制 (@， 性 助 | 文件 (E) 查看 ( 凡 控制 KG， 帮助 


一 全 一 


愿 这 段 时 光 能 给 


图 32-4 成 品 效果 之 四 图 32-5 成 品 效果 之 五 


32.1 制作 动画 所 需要 的 基本 元 素 


Step 1 新 建 一 个 空白 文档 ， 在 Properties 面板 中 设置 Size 为 320 x 280Pixels， 其 他 
参数 保持 默认 (图 32-6) 。 


|| Ap | se 320k290phes | Backoomd [| Fanepae [2 ns 
[第 三 + 二 重 - | Publsk PashPlgwe | 
图 32-6 在 Properties 面板 中 设置 参数 


Step 2 按 Ctrl+F8 组合 键 新 建 一 个 Symbol， 并 命名 为 “oicq-mv”。 使 用 > 工具 在 场景 
中 绘制 出 如 图 32-7 所 示 的 图 形 。 
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Step 3 ”使 用 * 工 具 将 图 形 轮廓 调整 为 曲线 ， 如 图 32--8 所 示 。 


图 32-7 绘制 图 形 图 32-8 调整 为 曲线 


Step 4 单 击 吉 工具， 选择 一 些 自己 喜欢 的 色彩 并 对 图 形 进行 填充 ， 如 图 32 一 9 所 示 。 
Step 5 ”使 用 双 工 具 画 出 图 形 的 明暗 交界 线 , 并 用 上 工具 对 曲线 的 圆滑 度 进行 调整 (图 
32 一 10) 。 


图 32-9 填充 色彩 图 32-10 明暗 交界 线 


Step 6 ”使 用 感 工具 对 图 形 的 背光 面 进行 填充 ， 然 后 按 Del 键 将 轮廓 线 删除 ， 最 后 效 
果 如 图 32 一 11 所 示 。 

Step 7 ”新 建 一 个 “投影 ”图 层 ,使 用 o 工具 在 场景 中 绘制 两 个 椭圆 作为 投影 (图 32 一 
12) 


图 32-11 填充 效果 


别 ， 这 样 才 能 体现 出 真实 的 透视 效果 


Step 8 ”新建 一 个 图 层 并 将 它 拖 至 最 底层 ， 使 用 “工具 在 场景 中 绘制 出 长 枪 的 轮廓 ， 
如 图 32-13 所 示 。 

Step 9 单 击 三 工具 ， 在 Color Mixer 面板 中 设置 填充 方式 为 Linear (图 32-14)， 填 充 
后 的 效果 如 图 32 一 15 所 示 。 


[ss5sss 


图 32-13 绘制 图 形 图 32-14 在 Color Mixer 面板 中 设置 填充 方式 
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图 32-15 填充 效果 


Step 10 ”使 用 工 具 对 枪 口 位 置 上 的 填充 色 进行 方向 . 色彩 比例 上 的 调整 (图 32 一 16) 
Step 11 使 用 ” .等 工具 继续 丰富 图 形 ， 最 终 效果 如 图 32-17 所 示 


图 32-16 调整 填充 色 图 32-17 丰富 图 形 


Step 12 ”在 所 有 图 层 的 第 4 帧 上 分 别 插 入 关键 帧 并 对 当前 图 形 进行 一 定 的 修改 ,使 
之 能 够 形成 循环 的 动画 效果 ， 如 图 32-18 所 示 
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图 32-18 循环 动画 


32.2 ”合成 动画 影片 


Step 1 按 有 ES 加 到 主场 景 ， 将 刚刚 制作 的 “oicq-mvy 元 件 拖 入 场景 中 ， 如 图 32- 
19 所 示 ， 然 后 在 第 64 帧 上 插入 一 个 关键 帧 。 


图 32-19 拖 入 场景 


Step 2 用 鼠标 右键 单 击 当 前 层 的 第 一 帧 ， 在 弹出 的 菜单 中 选择 Create Motion Tween 
生成 移动 渐变 动画 (图 32 一 20) 。 


材 委 可 吧 呈 [1 [lzops | oos 4 


图 32-20 生成 Motion Tween 
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Step 3 在 第 1 关键 帧 位 置 处 打开 Transform 面板 ， 按 图 32--21 所 示 进 行 设 置 ， 第 64 
帧 设置 如 图 32 一 22 所 示 ， 然 后 将 图 形 移动 至 场景 的 左下 角 (图 32 一 23 ) 。 


上 二 SODweN7 


Transform 所 Transform 


和 | 119.9% 可 119.9% 


Constrain 
人 Rotate ” 么 0.0* 


六 Skew 2| 0; 人 5 可 站 


图 32-21 Transforra 面板 图 32-22 Transform 面板 图 32-23 移动 至 场景 左下 角 


Step 4 “利用 同样 的 方法 制作 出 第 二 组 动画 ，Timeline 结构 和 位 置 关 系 如 图 32--24 所 


示 。 


279 


四 甸 昌 国 
h_ MX 经 解 析 | 人 


按 下 Ctrl+Enter 组 合 键 进行 预览 ， 就 可 以 模拟 出 镜头 由 近 逐 渐 拉 远 的 动画 效果 了 
(图 32 一 26 ) 。 


内 Macromedia Flash playen6 


记 


EEC 


辆 32-25 调整 大 小 、 色 调 图 32-26 预览 动画 


32.3 制作 文字 动态 效果 


Step 1 新 建 一 个 图 层 并 命名 为 “Background ， 在 第 65 帧 上 插入 一 个 关键 帧 ， 单 击 o 
工具 ， 设置 Fill color 为 #FF9900 并 绘制 一 个 与 场景 同样 大 小 的 矩形 ， 如 图 32--27 所 示 。 


图 32-27 绘制 矩形 


Step 2 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 按 图 32--28 所 示 进 行 设置 。 
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六 Graphie 人 | Help | 


图 32-28 新 建 Symbol 


Step 3 ”使 用 A 工 具 在 场景 中 随意 输入 一 些 文字 ， 然 后 按 F6 键 在 第 25 帧 上 插入 一 个 
关键 帧 并 将 文字 图 形 向 左 水 平移 动 ， 最 后 生成 Motion Tween 动画 (图 32 一 29 ) 。 


图 32-29 生成 Motion Tween 动画 


Step 4 使 用 相同 的 方法 制作 出 一 段 文字 渐变 动画 ,Timeline 结 构 和 动态 效果 如 图 32 一 
30 所 示 。 


图 32-30 文字 渐变 动画 


Step 5 。 按 EBERS 回 到 主场 景 ， 新 建 一 个 “word” 图 层 ， 在 第 65 帧 上 插入 一 个 关键 
帧 ， 然 后 将 刚刚 制作 的 文字 渐变 动画 拖 入 至 场景 中 合适 的 位 置 ， 如 图 32-31 所 示 。 


即将 凶 来 


图 32-31 拖 至 场景 中 


32.4 制作 局 部 特写 效果 


Step 1 新 建 一 个 “ground” 图 层 ， 在 第 93 帧 上 插入 一 个 关键 帧 ， 使 用 o .” 等 工具 绘 
制 出 如 图 32--32 所 示 的 地 面 图 形 。 

Step 2 按 F6 键 在 第 108 帧 上 插入 一 个 关键 帧 并 将 地 面 图 形 向 上 垂直 移动 ， 最 后 生成 
Motion Tween 动画 (图 32--33 ) 。 


-一 二 3 


图 32-32 绘制 地 面 图 32-33 ”Motion Tween 动画 


Step 3 ”新建 一 个 图 层 ， 按 F6 键 在 第 93 帧 上 插入 关键 帧 ， 然 后 将 Library 中 的 “oicqmy 
元 件 拖 入 场景 中 如 图 32--34 所 示 的 位 置 。 按 下 Ctrl+Enter 键 ， 就 可 以 看 到 局 部 特写 的 镜头 效 
果 了 (图 32 一 35) 。 
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图 32-34 拖 入 场景 图 32-35 预览 动画 


32.5 制作 跌倒 的 动画 效果 


Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 命 名 为 “fallof"。 使 用 v .& 等 工具 绘制 
出 如 图 32--36 所 示 的 图 形 。 

Step 2 新 建 一 个 Symbol， 使 用 工具 在 场景 中 绘制 一 个 椭圆 ， 然 后 配合 Alt 键 使 用 ， 
工具 向 右 重复 复制 三 次 (图 32 一 37) 。 


图 32-36 绘制 图 形 图 32-37 重复 复制 


Step 3 ”全 选 四 个 椭圆 ， 按 F8 键 将 其 转 为 一 个 Symbol。 新 建 一 个 图 层 ， 将 它 重新 拖 
入 场景 中 并 在 Properties 面板 中 设置 Alpha 为 30%， 如 图 32--38 所 示 。 

Step 4 在 当前 层 的 第 2 帧 上 插入 一 个 关键 帧 ， 适 当 改变 一 下 原 图 形 的 位 置 ， 使 之 能 
够 形成 不 断 循环 的 动画 效果 (图 32-39) 。 


四 四 划 国 


攻 
图 32-38 设置 Alpha 图 32-39 插入 关键 帧 


Step 5 ”用 鼠标 双击 进入 “falloff ”元 件 的 编辑 界面 ， 将 刚刚 制作 的 Symbol 拖 入 至 场 
景 的 合适 位 置 ， 如 图 32 一 40 所 示 。 


NI 一 


图 32-40 拖 入 场景 
Step 6 ”利用 所 学 过 的 知识 继续 丰富 画面 ， 绘 制 过 程 如 图 32 一 41 一 图 32 一 43 所 示 。 


外 全 全 个 个 全 下 的 个 丰 全 全 
罗 罗 和 放 一 一 


图 32-41 绘制 场景 图 32-42 绘制 背景 图 32-43 绘制 地 面 


Step 7 ”通过 Guide 命令 制作 一 段 引 导线 动画 ， 注 意 要 设置 引导 线 的 起 点 与 终点 (图 
32-44) ， Timeline 结构 如 图 32--45 所 示 。 


图 32-44 设置 引导 线 图 32-45 Timeline 结构 


Step 8 继续 制作 影片 片段 ， 完 成 后 的 效果 如 图 32--46 所 示 。 


图 32-46 最 后 效果 


32.6 ”影片 结尾 的 动画 效果 


Step 1 按 有 ER 卫 加 到 主场 景 ， 新 建 一 个 图 层 ， 在 第 109 帧 上 插入 一 个 关键 帧 ， 然 后 
将 Library 中 的 “falloff ”元 件 拖 至 场景 中 ， 如 图 32--47 所 示 。 


图 32-47 将 “falloff” 元 件 拖 至 场景 
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Step 2 “利用 Motion Tween 方式 在 影片 的 结尾 处 分 别 制作 两 段 移动 渐变 动画 ， 如 图 
32--48 和 图 32--49 所 示 。 


Replay)， 这 样 做 的 目的 是 方便 浏览 者 重复 


图 32-48 制作 渐变 动画 图 32-49 制作 渐变 动画 


32.7 ”制作 影片 的 预 载 画面 


Step 1 按 Shift+F2 组 合 键 打开 Scene 面板 , 双击 Scene 1 改 
名 为 “main ” ， 如 图 32--50 所 示 。 


虽 填 | 全 | 
图 32-50 Scene 面板 
Step 2 ”在 Properites 面板 中 设 定 第 1 帧 和 第 280 帧 的 Frame Label 分 别 为 “start ”和 
“ok ， 如 图 32--51 所 示 。 


Properties 


32-51 设 定 Frame Label 


Step 3 ”在 Scene 面板 中 新 建 一 个 Scene 2， 然 后 将 它 拖 至 最 顶层 (图 32 一 52) 。 


286 


@ 


网 络 宣传 动画 


图 32-52 新 建 Scene 2 


Step 4 单 击 o 工 具 ， 设置 Fill color 为 并 FF9900 并 绘制 一 个 与 场景 同样 大 小 的 矩形 ， 
然后 将 Library 中 的 “oicq-mv” 元 件 拖 入 Scene 2 场景 中 ， 如 图 32--53 所 示 . 

Step 5 ”新 建 一 个 图 层 ， 使 用 并 工具 在 场景 中 输入 “Loading” 字 样 ， 这 样 做 可 以 提示 
浏览 者 目前 动画 影片 正在 预 载 中 (图 32--54) 。 


loading... 


图 32-53 拖 至 Scene 2 场景 图 32-54 输入 文字 


Step 6 新 建 一 个 “Actions” 图 层 ， 单 击 第 1 帧 ， 在 Actions 面板 中 输入 图 32 一 55 所 
示 的 代码 。 


TREE 
Action [aneloadedyperfoms acionsohyFaporUCUSFFaNeE 1OSded 
Scene- [mm 


Jpe [Fanetaoa 
Frame: [ex 


图 32-55 在 Actions 面板 中 输入 代码 
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Step 7 在 当前 层 的 第 2 帧 上 插入 一 个 关键 帧 ， 然 后 在 Action 面板 中 双击 goto 命令 
在 Frame 后 面 的 对 话 框 中 输入 1， 如 图 32 一 56 所 示 。 


国 Actions for Frame 2 of Layer Name action5s 


付 | Actions <] | | goto : Go to the specified Frame of the movie 本 


侦 | Movie control 


国 goto 他 GotoandPlag 斑 GotoandStop 
on Scene | ccurrent scene> 
2 play Type [FameNumber 
Stop 和 
Frame | 
国 stopAllsounds 


园 Browser/Network 
Movie Clip Control 
Variables 
园 conditions/Loops 
Printing 
User-Defined Funct… 


二 一 有 名 征 


图 32-56 在 Actions 面板 中 设置 参数 


就 跳 至 “main ”场景 的 第 1 帧 “st art ”处 并 开始 播放 ， 如 果 未 


32.8 小 结 


在 这 个 范例 中 , 影片 一 开始 呈现 出 的 是 预 载 画面 ,等 到 整个 电影 文件 都 下 载 完成 之 后 ， 
才 会 跳 至 影片 的 主 画面 进行 播放 , 这 样 的 Loading 技 巧 在 网 络 动画 中 经 常 能 够 看 到 。 当 Flash 
影片 文件 较 大 的 时 候 , 通常 需要 制作 一 个 预 载 画面 , 否则 影片 将 会 断断续续 的 播放 , 从 而 直 
接 影响 到 作品 的 欣赏 效果 。 
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本 章 重点 


制作 网 络 资源 下 载 页 面 的 基本 方法 与 技巧 

通过 Motion TWeen、Shape 等 动画 形式 制作 丰富 的 页 面 动画 效果 
在 按钮 的 Over 影 帧 中 插入 声音 文件 

如 何 制 作 按钮 的 旋转 效果 


合成 影片 与 设置 ffcomrnahd 


预览 成 品 


网 络 资源 下 载 页 面 通常 用 在 Flash 个 人 主页 之 中 (图 33-1) , 它 能 够 比 传统 的 HTML 页 面 
呈现 出 更 加 丰富 的 页 面 动态 效果 ， 如 图 33-2 和 图 33-3 所 示 


由 Macromedia Flash player 6 


图 33-1 网 络 资源 下 载 页 面 
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图 33-2 成品 效 果 之 一 


33.1 制作 网 页 Logo 动画 


Step 1 启动 Flash MX , 新 建 空白 文档 。 在 Properties 面 板 中 设置 Size 为 400 x 550Pixels， 
Background 设 定 为 #000000， 其 他 参数 保持 默认 (图 33-4) 。 


KK Docurment Size: 400x550 pisels | Background- 可 Frame Fate: | 12 fps 
第 三 十 三 焉 .- Publish:。 Flash Player6 | 


图 33-4 在 Properties 面板 中 设置 参数 


Step 2 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 命 名 为 “Logo ， 设 置 Behavior 为 Movie 
Clip (影片 片段 ) 。 选 择 File | Import (导入 ) 命令 将 附 赠 光 盘 中 素材 | logo-Gray .jpg 文件 导 
入 场景 中 ， 然 后 使 用 罗 工 具 将 图 形 调 整 到 合适 大 小 ， 如 图 33--5 所 示 。 


5 DSS 


GRAY-TONE 


图 33-5 导入 图 片 


人 网 络 资源 下 载 页 面 ] 


Step 3 新建 一 个 图 层 ， 按 F6 键 在 第 11 帧 上 插入 一 个 关键 帧 ， 选 择 File | Import 命 
令 将 附 赠 光 盘 中 素材 | logo-RGB jpg 文件 导入 场景 中 , 然后 使 用 豆 工 具 将 图 形 调整 到 能 够 完 
全 覆盖 上 一 张 图 片 的 位 置 (图 33--6)。 


GRAY=-TOANL 


图 33-6 导入 图 片 


完全 重合 的 效果 ， 如 图 33 一 7 所 示 。 


我 们 可 以 通过 设置 举 标 的 方法 来 实现 两 张 图 天 


EYE 
图 33-7 设置 坐标 


Step 4 继续 新 建 一 个 图 层 ， 在 第 11 帧 上 插入 一 个 关键 帧 ， 使 用 所 工具 在 场景 中 绘制 
一 组 矩形 ， 如 图 33-8 所 示 。 


图 33-8 绘制 矩形 


Step 5 在 第 23 和 第 35 帧 上 分 别 插入 关键 帧 并 生成 Motion Tween 动画 ， 然 后 将 第 23 
帧 内 的 和 矩形 向 下 垂直 移动 至 图 33-9 所 示 的 位 置 . 


办 外 划 国 
sh MX 经 典 作 品 解 析 | 仓 


人 1 抽 6 卫 1 


图 33-9 向 下 垂直 移动 


Step 6 ”用 鼠标 右键 单 击 当 前 图 层 ， 在 弹出 的 菜单 中 选择 Mask 选项 ， 然 后 按 F5 键 延 
长 所 有 图 层 的 时 间 轴 ， 如 图 33-10 所 示 。 


DB 18 1120fps | 14s 1 


图 33-10 Mask ( 遮 罩 ) 效果 


Step 7 ”使 用 相同 的 方法 制作 出 第 二 段 动画 元 素 ，Timeline 结构 和 动态 效果 如 图 33-- 
1 所 示 . 


表 有 二 人 5 51 如 
> 


SOWY7 


图 33-11 Timeline 结构 和 动态 效果 


33.2 制作 页 面 动画 效果 


Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol， 使 用 Motion Tween 和 Shape 动 男方 式 制作 
一 组 动态 元 素 (图 33-12 和 图 33 一 13) 


2Z92 


人 下 载 页 面 | 


网 络 资源 


为 F1a sh 增加 一 些 动态 的 元 素 可 以 起 到 丰富 画面 、 增 加 作品 感染 力 的 效果 ， 而 在 制作 动态 元 素 的 
过 程 中 往往 随意 性 较 大 ， 所 以 读者 不 必 拘 泥 于 教程 ， 完 全 可 以 根据 自己 的 想像 力 进行 深入 制作 。 


图 33-12 动态 元 素 


图 33-13 动态 元 素 


Step 2 新建 一 个 Symbol， 在 场景 中 制作 第 二 组 动态 元 素 ， 如 图 33-14 所 示 。 


图 33-14 第 二 组 动态 元 素 
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Step 3 按 CtrI+F8 组 合 键 新 建 一 个 Symbol， 并 命名 为 
“zuopin-1”。 单 击 吕 工具， 在 Color Mixer 面板 中 按 图 33-15 所 
示 设 置 Fill Color (填充 色 ) 。 


图 33-15 在 Color Mixer 面 
板 设 置 参 数 


Step 4 在 Options 中 单 击 Round Rectangle Radius ( 导 角 ) 按钮 ， 在 弹出 的 Rectangle 


Settings 面板 中 设置 其 导 角 的 大 小 (图 33-16)， 然 后 在 场景 中 绘制 一 个 导 角 欠 形 ， 如 图 33 一 
17 所 示 。 


Rectangle Settings 


Corner 日 points 


图 33-16 Rectangle Settings 面板 图 33-17 绘制 导 角 矩形 


Step 5 “新建 一 个 图 层 ， 使 用 卉 工具 在 场景 中 随意 插入 一 些 文字 或 图 形 ， 如 图 33 一 18 
所 示 。 
Step 6 ”新 建 一 个 图 层 ， 将 Library 中 的 第 一 组 动画 元 素 拖 入 场景 中 ， 然 后 打开 Trans- 
form 面板 ， 按 图 33-19 所 示 对 图 形 进 行 水 平 镜 像 ， 最 后 效果 如 图 33=20 所 示 。 


Transform 


三 38.5% 可 38.5% 


到 Constrain 


做 Rotakte 一 


图 33-18 插入 文字 与 图 形 图 33-19 在 Transform 面板 中 
设置 参数 
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图 33-20 拖 入 场 最 


Step 7 ”使 用 相同 的 方法 制作 出 其 他 五 个 页 面 动 画 ， 如 图 33-21 - 图 33-25 所 示 . 


图 833-21 页 面 动画 效果 一 图 33-22 页 面 动画 效果 二 


图 33-23 页面 动 画 效 果 三 图 33-24 页 面 动画 效果 四 


图 33-25 页 面 动画 效果 五 


33.3 ”按钮 的 动画 效果 


Step 1 按 Ctrl+F8 组 合 键 新 建 一 个 Symbol ， 
并 命名 为 “按钮 -mv ”， 设 置 Behavior 为 Movie 
Clip (影片 片段 ) 。 选 择 File | Import (导入 ) 命 
令 ,将 附 赠 光 盘 中 素材 | 按钮 图 片 .jpg 文件 导入 
场景 中 ,然后 使 用 可 工具 将 图 形 调 整 到 合适 大 小 
(图 33-26 ) ， 


图 33-26 导入 图 片 并 调整 大 小 
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Step 2 新建 一 个 图 层 ， 然 后 使 用 o 工 具 在 按钮 的 左 侧 绘制 一 个 矩形 ， 如 图 33-“7 所 


示 。 


图 33-27 绘制 矩形 


Step 3 单 击 * 工具， 配合 Alt+Shift 组 合 键 将 图 形 向 右 水 平复 制 ， 注 意 要 留 出 一 定 的 
空 阶 (图 33-28 ) 。 


图 33-28 复制 图 形 


Step 4 全 选 所 有 矩形 ， 按 F8 键 将 其 转 为 一 个 Symbol (图 33-29)。 在 当前 层 的 第 10 
帧 上 插入 一 个 关键 帧 ， 然 后 将 图 形 向 右 水 平移 动 并 生成 Motion Tween 动画 ， 如 图 33-30 所 


[converttosymbol aa 


Behavior: 人 六 Wovie Clip Registrati 踢 三 | 


一 Button 
6 区 WRiS Advanced | kelp | 


图 33-29 转 为 Symbol 图 33-30 Motion Tween 动画 


Step 5 “用 鼠标 右键 单 击 当 前 图 层 ， 在 弹出 的 菜单 中 选择 Mask 选项 ， 然 后 按 下 Enter 
键 预览 Timeline， 就 可 以 模拟 出 按钮 旋转 的 动画 效果 了 (图 33-31 ) 。 
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图 33-31 添加 Mask ( 遮 罩 ) 
33.4 合成 按钮 


Step 1 新建 一 个 Symbol， 按 图 33-32 所 示 进 行 设置 ， 然 后 将 Library 中 的 “按钮 图 
片 ”元 件 拖 入 Up 影 帧 中 (图 33-33)。 


Create New Symbol | 


ET 
8 芭 

人 Button Eu | 

和 havancea | Melp | 


图 33-32 新 建 Symbol 图 33-33 拖 入 Up 影 帧 


Step 2 按 F6 键 在 Over 影 帧 上 插入 一 个 关键 帧 ， 将 “按钮 -my ”元 件 拖 入 场景 中 并 
通过 设置 坐标 的 方法 使 两 个 影 帧 中 的 图 形 完 全 重合 ， 如 图 33-34 所 示 。 


33-34 拖 入 场景 
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第 4 篇 网 络 互动 媒体 篇 


Step 3 选择 File | Import (导入 ) 命令 ， 将 附 赠 光 盘 中 素材 | 按钮 - 声音 .WAYV 文 
件 导 入 Over 影 帧 中 ， 如 图 33-35 所 示 。 


图 33-35 导入 声音 文件 
Step 4 继续 制作 按钮 的 Down 和 Hit 影 帧 ， 最 后 效果 如 图 33-36 所 示 。 


图 33-36 Down 和 了 Hit 影 帧 
33.5 ”合成 影片 与 设置 fcommand 


Step 1 单 击 上 按钮 返回 到 主场 景 中 ， 按 图 
33-37 所 示 将 所 有 元 件 进 行 整合 。 


图 33-37 合 元 件 
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随意 单 击 某 一 影 帧 或 元 件 (笔者 选择 的 是 “Logo 动画 ”元 件 ) ， 匆 
tions 面板 中 双击 fscommand 命令 ， 按 图 33-38 所 示 进 行 设置 。 


图 Acuons for [No instance 


name assigned] (logo) 


团 fscommand 


团 Movie Clip control 
园 variables 
园 conditions/Loops 
-一 


Une 2; fscommandf'alowscale False) 


图 33-38 双击 fscomrmand 命令 


代码 分 析 


为 true， 则 影片 面 面 让 了 基 汶 览 和 富 电 的 夫 外 肌 册 和 全 以 便 能 够 等 比例 地 充满 邓 个 窗口 


33-39 )。 如 果 将 参数 设 定 为 false ， 影 片 画面 将 会 保持 固定 的 长 宽 尺 寸 ， 并 不 会 根据 窗口 的 大 小 
行 缩放 〔〈 图 33-40 )。 


图 33-39 参数 设 定 为 true 图 33-40 参数 设 定 为 false 


继续 在 Actions 面板 中 双击 fcommand 命令 ， 按 图 33-41 所 示 进 行 设置 。 


可 


ImCliPEvent (jpad) { 
mrmand( 
Movie Cip Control 
梧 varnables 
加 cenditions/Loops 


Une 3 fscommandC showmernu ,fakeh) 


图 33-41 双击 fscommand 命令 


单 。 如 果 设 定 为 true ， 则 显示 菜单 〈 图 33-42 和 


ish Showy 


| 设 杜 … 
关于 Maaomedia Flash Player 6.… 


图 33-42 参数 设 定 为 true 图 33-43 参数 设 定 为 false 


33.6 -小结 


实际 上 制作 网 络 资源 下 载 页 面 与 制作 动画 影片 的 方法 以 及 原理 都 是 一 样 的 ,所 以 只 要 能 
够 熟练 地 掌握 其 中 一 种 动画 的 制作 方法 ， 就 完全 可 以 将 它 应 用 到 其 他 领域 ， 如 人 机 交互 界 
面 、Flash 导航 地 图 以 及 虚拟 场景 等 等 。 


